Multiple style sheets

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
8 messages Options
Reply | Threaded
Open this post in threaded view
|

Multiple style sheets

Burella Juan M.
I want my page to be able to alternate between two stylesheets. You can read the technique here: http://www.alistapart.com/stories/alternate/

and examples here: http://www.csszengarden.com/

I've written this using XHTML/CSS and a Javascript styleswitcher (so it's client side switching)  in the following way:

<link rel="stylesheet" href="styles/bare.css" type="text/css" title="Bare" media="screen, projection" />
<link rel="alternate stylesheet" href="styles/blue.css" type="text/css" title="Blue" media="screen, projection" />
<script type="text/javascript" src="styles/styleswitch.js"></script>

does anybody knows how can (or at least the easiest way) achieve this in Seaside?

(I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi Bryant from may 2004 but haven't found anything in the SqueakMap and Cincom Public Repository, any idea?).

Juan

_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Philippe Marschall
2006/9/20, Burella Juan M. <[hidden email]>:

> I want my page to be able to alternate between two stylesheets. You can read
> the technique here:
> http://www.alistapart.com/stories/alternate/
>
> and examples here: http://www.csszengarden.com/
>
> I've written this using XHTML/CSS and a Javascript styleswitcher (so it's
> client side switching)  in the following way:
>
> <link rel="stylesheet" href="styles/bare.css" type="text/css" title="Bare"
> media="screen, projection" />
> <link rel="alternate stylesheet" href="styles/blue.css" type="text/css"
> title="Blue" media="screen, projection" />
> <script type="text/javascript"
> src="styles/styleswitch.js"></script>
>
> does anybody knows how can (or at least the easiest way) achieve this in
> Seaside?
>
> (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi Bryant
> from may 2004 but haven't found anything in the SqueakMap and Cincom Public
> Repository, any idea?).

Try the following, add these methods to WAHtmlRoot

styleElementWithHref: anUrlString titled: aTitleString media: aMediaString
        ^(self styleElementWithHref: anUrlString)
                attributeAt: 'title' put: aTitleString;
                attributeAt: 'media' put: aMediaString;
                yourself

linkToStyle: url titled: aString media: aMediaString
        self addHeadElement:
                (self
                        styleElementWithHref: (self absoluteUrlForResource: url asString)
                        titled: aString
                         media: aMediaString)

then in your root component class:

updateRoot: anHtmlRoot
        super updateRoot: anHtmlRoot.
        anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
'screen, projection'.
        anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
'screen, projection'.
        anHtmlRoot linkToStyle: 'styles/styleswitch.js'

Damn we need the canvas api for head elements too.

Philippe
_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: Re: Multiple style sheets

Lukas Renggli
> Damn we need the canvas api for head elements too.

+1

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Philippe Marschall
In reply to this post by Philippe Marschall
2006/9/20, Philippe Marschall <[hidden email]>:

> 2006/9/20, Burella Juan M. <[hidden email]>:
> > I want my page to be able to alternate between two stylesheets. You can read
> > the technique here:
> > http://www.alistapart.com/stories/alternate/
> >
> > and examples here: http://www.csszengarden.com/
> >
> > I've written this using XHTML/CSS and a Javascript styleswitcher (so it's
> > client side switching)  in the following way:
> >
> > <link rel="stylesheet" href="styles/bare.css" type="text/css" title="Bare"
> > media="screen, projection" />
> > <link rel="alternate stylesheet" href="styles/blue.css" type="text/css"
> > title="Blue" media="screen, projection" />
> > <script type="text/javascript"
> > src="styles/styleswitch.js"></script>
> >
> > does anybody knows how can (or at least the easiest way) achieve this in
> > Seaside?
> >
> > (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi Bryant
> > from may 2004 but haven't found anything in the SqueakMap and Cincom Public
> > Repository, any idea?).
>
> Try the following, add these methods to WAHtmlRoot
>
> styleElementWithHref: anUrlString titled: aTitleString media: aMediaString
>         ^(self styleElementWithHref: anUrlString)
>                 attributeAt: 'title' put: aTitleString;
>                 attributeAt: 'media' put: aMediaString;
>                 yourself
>
> linkToStyle: url titled: aString media: aMediaString
>         self addHeadElement:
>                 (self
>                         styleElementWithHref: (self absoluteUrlForResource: url asString)
>                         titled: aString
>                          media: aMediaString)
>
> then in your root component class:
>
> updateRoot: anHtmlRoot
>         super updateRoot: anHtmlRoot.
>         anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/styleswitch.js'

The last line should of course read:

         anHtmlRoot linkToScript: 'styles/styleswitch.js'

Philippe
_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Burella Juan M.
Philippe, thanks for your reply. I've downloaded the latest Seaside and tested your suggestion but the styles aren't swapped at all.
If you look carefully, there's two values of the "rel" property:

<link rel="stylesheet"  ...
<link rel="alternate stylesheet" ...

rel="stylesheet" it means to "default stylesheet"
So I've added the following:

addLinkToStyle: url titled: aString media: aMediaString

        self addHeadElement:
                (self addStyleElementWithHref: (self absoluteUrlForResource: url asString)
                      titled: aString
                      media: aMediaString)

addStyleElementWithHref: anUrlString titled: aTitleString media: aMediaString
        ^(self styleElementWithHref: anUrlString)
    attributeAt: 'rel' put: 'alternate stylesheet';
                attributeAt: 'title' put: aTitleString;
                attributeAt: 'media' put: aMediaString;
                yourself

and finally in my WATestComponent

updateRoot: aRoot
    "Configure the receiver's meta-data'"

  super updateRoot: aRoot.
  aRoot addHeadElement:
    ((WAHtmlElement named: 'meta')
        attributeAt: 'author' put: '-';
        attributeAt: 'description' put: '-';
        attributeAt: 'content-type' put: 'text/html; charset=UTF-8'
        yourself).
   aRoot linkToStyle: 'template\styles\bare.css' titled: 'Bare' media: 'screen, projection'.
   aRoot addLinkToStyle: 'template\styles\blue.css' titled: 'Blue' media: 'screen, projection'.
   aRoot linkToScript: 'template\styles\styleswitch.js'

It doesn't work. I've putted an alert() in the .js file and is showed when the page is rendered, but it seems the styles aren't read or parsed, although they both "<link rel=...>" specificationes appear in the head of the xhtml. Commenting out the super send doesn´t have any effect too. However, when I've defined the message #style

style
    | file |
    file := (FileStream readOnlyFileNamed: 'template\styles\blue.css') ascii.
    ^[file contents] ensure: [file close].

the page is rendered with the blue.css style. But nothing happens when I clicked the link to swap the style. Hence it seems to be like the style stuff is hardcoded to the #style message in the client class (my WATestComponent). Any ideas? Is this a bug?
I've tested with Squeak 3.8 and Firefox 1.5 and Opera 9. You can test with the attached .js

Greetings

On 9/20/06, Philippe Marschall <[hidden email]> wrote:
2006/9/20, Philippe Marschall <[hidden email]>:

> 2006/9/20, Burella Juan M. <[hidden email]>:
> > I want my page to be able to alternate between two stylesheets. You can read
> > the technique here:
> > http://www.alistapart.com/stories/alternate/
> >
> > and examples here: http://www.csszengarden.com/
> >
> > I've written this using XHTML/CSS and a Javascript styleswitcher (so it's
> > client side switching)  in the following way:
> >
> > <link rel="stylesheet" href="styles/bare.css" type="text/css" title="Bare"
> > media="screen, projection" />
> > <link rel="alternate stylesheet" href="styles/blue.css" type="text/css"
> > title="Blue" media="screen, projection" />
> > <script type="text/javascript"
> > src="styles/styleswitch.js"></script>
> >
> > does anybody knows how can (or at least the easiest way) achieve this in
> > Seaside?
> >
> > (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi Bryant
> > from may 2004 but haven't found anything in the SqueakMap and Cincom Public
> > Repository, any idea?).
>
> Try the following, add these methods to WAHtmlRoot
>
> styleElementWithHref: anUrlString titled: aTitleString media: aMediaString
>         ^(self styleElementWithHref: anUrlString)
>                 attributeAt: 'title' put: aTitleString;
>                 attributeAt: 'media' put: aMediaString;
>                 yourself
>
> linkToStyle: url titled: aString media: aMediaString
>         self addHeadElement:
>                 (self
>                         styleElementWithHref: (self absoluteUrlForResource: url asString)
>                         titled: aString
>                          media: aMediaString)
>
> then in your root component class:
>
> updateRoot: anHtmlRoot
>         super updateRoot: anHtmlRoot.
>         anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/styleswitch.js'

The last line should of course read:

         anHtmlRoot linkToScript: 'styles/styleswitch.js'

Philippe
_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside


_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

styleswitch.js (3K) Download Attachment
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Burella Juan M.
Philippe, thanks for your reply. I've downloaded the latest Seaside and tested your suggestion but the styles aren't swapped at all.
If you look carefully, there's two values of the "rel" property:

<link rel="stylesheet"  ...
<link rel="alternate stylesheet" ...

rel="stylesheet" it means to "default stylesheet"
So I've added the following:

addLinkToStyle: url titled: aString media: aMediaString

        self addHeadElement:
                (self addStyleElementWithHref: (self absoluteUrlForResource: url asString)
                      titled: aString
                      media: aMediaString)

addStyleElementWithHref: anUrlString titled: aTitleString media: aMediaString
        ^(self styleElementWithHref: anUrlString)
    attributeAt: 'rel' put: 'alternate stylesheet';
                attributeAt: 'title' put: aTitleString;
                attributeAt: 'media' put: aMediaString;
                yourself

and finally in my WATestComponent

updateRoot: aRoot
    "Configure the receiver's meta-data'"

  super updateRoot: aRoot.
  aRoot addHeadElement:
    ((WAHtmlElement named: 'meta')
        attributeAt: 'author' put: '-';
        attributeAt: 'description' put: '-';
        attributeAt: 'content-type' put: 'text/html; charset=UTF-8'
        yourself).
   aRoot linkToStyle: 'template\styles\bare.css' titled: 'Bare' media: 'screen, projection'.
   aRoot addLinkToStyle: 'template\styles\blue.css' titled: 'Blue' media: 'screen, projection'.
   aRoot linkToScript: 'template\styles\styleswitch.js'

It doesn't work. I've putted an alert() in the .js file and is showed when the page is rendered, but it seems the styles aren't read or parsed, although they both "<link rel=...>" specificationes appear in the head of the xhtml. Commenting out the super send doesn´t have any effect too. However, when I've defined the message #style

style
    | file |
    file := (FileStream readOnlyFileNamed: 'template\styles\blue.css') ascii.
    ^[file contents] ensure: [file close].

the page is rendered with the blue.css style. But nothing happens when I clicked the link to swap the style. Hence it seems to be like the style stuff is hardcoded to the #style message in the client class (my WATestComponent). Any ideas? Is this a bug?
I've tested with Squeak 3.8 and Firefox 1.5 and Opera 9. You can test with the attached .js

Greetings


On 9/20/06, Philippe Marschall <[hidden email]> wrote:
2006/9/20, Philippe Marschall <[hidden email]>:
> 2006/9/20, Burella Juan M. <[hidden email]>:
> > I want my page to be able to alternate between two stylesheets. You can read

> > the technique here:
> > <a href="http://www.alistapart.com/stories/alternate/" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)">http://www.alistapart.com/stories/alternate/
> >
> > and examples here: <a href="http://www.csszengarden.com/" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)"> http://www.csszengarden.com/
> >
> > I've written this using XHTML/CSS and a Javascript styleswitcher (so it's
> > client side switching)  in the following way:
> >
> > <link rel="stylesheet" href="styles/bare.css" type="text/css" title="Bare"
> > media="screen, projection" />
> > <link rel="alternate stylesheet" href="styles/blue.css" type="text/css"
> > title="Blue" media="screen, projection" />
> > <script type="text/javascript"
> > src="styles/styleswitch.js"></script>
> >
> > does anybody knows how can (or at least the easiest way) achieve this in
> > Seaside?
> >
> > (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi Bryant
> > from may 2004 but haven't found anything in the SqueakMap and Cincom Public
> > Repository, any idea?).
>
> Try the following, add these methods to WAHtmlRoot
>
> styleElementWithHref: anUrlString titled: aTitleString media: aMediaString
>         ^(self styleElementWithHref: anUrlString)
>                 attributeAt: 'title' put: aTitleString;

>                 attributeAt: 'media' put: aMediaString;
>                 yourself
>
> linkToStyle: url titled: aString media: aMediaString
>         self addHeadElement:
>                 (self
>                         styleElementWithHref: (self absoluteUrlForResource: url asString)
>                         titled: aString
>                          media: aMediaString)
>
> then in your root component class:
>
> updateRoot: anHtmlRoot
>         super updateRoot: anHtmlRoot.
>         anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
> 'screen, projection'.
>         anHtmlRoot linkToStyle: 'styles/styleswitch.js'

The last line should of course read:

         anHtmlRoot linkToScript: 'styles/styleswitch.js'

Philippe
_______________________________________________
Seaside mailing list
[hidden email]
<a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" target="_blank" onclick="return top.js.OpenExtLink(window,event,this)"> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside



_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

styleswitch.js (3K) Download Attachment
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Philippe Marschall
In reply to this post by Burella Juan M.
2006/9/29, Burella Juan M. <[hidden email]>:

> Philippe, thanks for your reply. I've downloaded the latest Seaside and
> tested your suggestion but the styles aren't swapped at all.
> If you look carefully, there's two values of the "rel" property:
>
> <link rel="stylesheet"  ...
> <link rel="alternate stylesheet" ...
>
> rel="stylesheet" it means to "default stylesheet"
> So I've added the following:
>
> addLinkToStyle: url titled: aString media: aMediaString
>
>         self addHeadElement:
>                 (self addStyleElementWithHref: (self absoluteUrlForResource:
> url asString)
>                       titled: aString
>                       media: aMediaString)
>
> addStyleElementWithHref: anUrlString titled: aTitleString media:
> aMediaString
>         ^(self styleElementWithHref: anUrlString)
>     attributeAt: 'rel' put: 'alternate stylesheet';
>                 attributeAt: 'title' put: aTitleString;
>                 attributeAt: 'media' put: aMediaString;
>                 yourself

What's the difference again between href and and url?

> and finally in my WATestComponent
>
> updateRoot: aRoot
>     "Configure the receiver's meta-data'"
>
>   super updateRoot: aRoot.
>   aRoot addHeadElement:
>     ((WAHtmlElement named: 'meta')
>         attributeAt: 'author' put: '-';
>         attributeAt: 'description' put: '-';
>         attributeAt: 'content-type' put: 'text/html; charset=UTF-8'
>         yourself).

Is ignored anyway.

>    aRoot linkToStyle: 'template\styles\bare.css' titled: 'Bare' media:
> 'screen, projection'.
>    aRoot addLinkToStyle: 'template\styles\blue.css' titled: 'Blue' media:
> 'screen, projection'.
>     aRoot linkToScript: 'template\styles\styleswitch.js'

Backward slashes? srsly?

> It doesn't work. I've putted an alert() in the .js file and is showed when
> the page is rendered, but it seems the styles aren't read or parsed,
> although they both "<link rel=...>" specificationes appear in the head of
> the xhtml.

So everything is rendered as it should it just doesn't work as
descripbed in the tutoriasl

> Commenting out the super send doesn´t have any effect too.

Sure, it only disables the #style method.

> However, when I've defined the message #style
>
> style
>     | file |
>     file := (FileStream readOnlyFileNamed: 'template\styles\blue.css')
> ascii.
>     ^[file contents] ensure: [file close].
>
> the page is rendered with the blue.css style. But nothing happens when I
> clicked the link to swap the style. Hence it seems to be like the style
> stuff is hardcoded to the #style message in the client class (my
> WATestComponent).

The code you posted above looks pretty hard coded to me.

> Any ideas? Is this a bug?
> I've tested with Squeak 3.8 and Firefox 1.5 and Opera 9. You can test with
> the attached .js

It would help if you could come up with a minimal demo of the problem.

> Greetings
>
>
> On 9/20/06, Philippe Marschall < [hidden email]> wrote:
> >
> > 2006/9/20, Philippe Marschall < [hidden email]>:
> > > 2006/9/20, Burella Juan M. <[hidden email]>:
> > > > I want my page to be able to alternate between two stylesheets. You
> can read
> > > > the technique here:
> > > > http://www.alistapart.com/stories/alternate/
> > > >
> > > > and examples here: http://www.csszengarden.com/
> > > >
> > > > I've written this using XHTML/CSS and a Javascript styleswitcher (so
> it's
> > > > client side switching)  in the following way:
> > > >
> > > > <link rel="stylesheet" href="styles/bare.css" type="text/css"
> title="Bare"
> > > > media="screen, projection" />
> > > > <link rel="alternate stylesheet" href="styles/blue.css"
> type="text/css"
> > > > title="Blue" media="screen, projection" />
> > > > <script type="text/javascript"
> > > > src="styles/styleswitch.js"></script>
> > > >
> > > > does anybody knows how can (or at least the easiest way) achieve this
> in
> > > > Seaside?
> > > >
> > > > (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi
> Bryant
> > > > from may 2004 but haven't found anything in the SqueakMap and Cincom
> Public
> > > > Repository, any idea?).
> > >
> > > Try the following, add these methods to WAHtmlRoot
> > >
> > > styleElementWithHref: anUrlString titled: aTitleString media:
> aMediaString
> > >         ^(self styleElementWithHref: anUrlString)
> > >                 attributeAt: 'title' put: aTitleString;
> > >                 attributeAt: 'media' put: aMediaString;
> > >                 yourself
> > >
> > > linkToStyle: url titled: aString media: aMediaString
> > >         self addHeadElement:
> > >                 (self
> > >                         styleElementWithHref: (self
> absoluteUrlForResource: url asString)
> > >                         titled: aString
> > >                          media: aMediaString)
> > >
> > > then in your root component class:
> > >
> > > updateRoot: anHtmlRoot
> > >         super updateRoot: anHtmlRoot.
> > >         anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
> > > 'screen, projection'.
> > >         anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
> > > 'screen, projection'.
> > >         anHtmlRoot linkToStyle: 'styles/styleswitch.js'
> >
> > The last line should of course read:
> >
> >          anHtmlRoot linkToScript: 'styles/styleswitch.js'
> >
> > Philippe
> > _______________________________________________
> > Seaside mailing list
> > [hidden email]
> >
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
>
>
> _______________________________________________
> Seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>
>
>
_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: Multiple style sheets

Philippe Marschall
In reply to this post by Burella Juan M.
Hi

See attached file for an example that works for me.

God damn WA(Rendered)HtmlRoot is such a piece of crap. Hack on top of
hack. Uglier than the night. Needs canvas now!

Philippe


2006/10/1, Burella Juan M. <[hidden email]>:

> Philippe, thanks for your reply. I've downloaded the latest Seaside and
> tested your suggestion but the styles aren't swapped at all.
> If you look carefully, there's two values of the "rel" property:
>
> <link rel="stylesheet"  ...
> <link rel="alternate stylesheet" ...
>
> rel="stylesheet" it means to "default stylesheet"
> So I've added the following:
>
> addLinkToStyle: url titled: aString media: aMediaString
>
>         self addHeadElement:
>                 (self addStyleElementWithHref: (self absoluteUrlForResource:
> url asString)
>                       titled: aString
>                       media: aMediaString)
>
> addStyleElementWithHref: anUrlString titled: aTitleString media:
> aMediaString
>         ^(self styleElementWithHref: anUrlString)
>     attributeAt: 'rel' put: 'alternate stylesheet';
>                 attributeAt: 'title' put: aTitleString;
>                 attributeAt: 'media' put: aMediaString;
>                 yourself
>
> and finally in my WATestComponent
>
> updateRoot: aRoot
>     "Configure the receiver's meta-data'"
>
>    super updateRoot: aRoot.
>   aRoot addHeadElement:
>     ((WAHtmlElement named: 'meta')
>         attributeAt: 'author' put: '-';
>         attributeAt: 'description' put: '-';
>         attributeAt: 'content-type' put: 'text/html; charset=UTF-8'
>         yourself).
>    aRoot linkToStyle: 'template\styles\bare.css' titled: 'Bare' media:
> 'screen, projection'.
>    aRoot addLinkToStyle: 'template\styles\blue.css' titled: 'Blue' media:
> 'screen, projection'.
>     aRoot linkToScript: 'template\styles\styleswitch.js'
>
> It doesn't work. I've putted an alert() in the .js file and is showed when
> the page is rendered, but it seems the styles aren't read or parsed,
> although they both "<link rel=...>" specificationes appear in the head of
> the xhtml. Commenting out the super send doesn´t have any effect too.
> However, when I've defined the message #style
>
> style
>     | file |
>     file := (FileStream readOnlyFileNamed: 'template\styles\blue.css')
> ascii.
>     ^[file contents] ensure: [file close].
>
> the page is rendered with the blue.css style. But nothing happens when I
> clicked the link to swap the style. Hence it seems to be like the style
> stuff is hardcoded to the #style message in the client class (my
> WATestComponent). Any ideas? Is this a bug?
> I've tested with Squeak 3.8 and Firefox 1.5 and Opera 9. You can test with
> the attached .js
>
> Greetings
>
>
> On 9/20/06, Philippe Marschall < [hidden email]> wrote:
> > 2006/9/20, Philippe Marschall < [hidden email]>:
> > > 2006/9/20, Burella Juan M. <[hidden email]>:
> > > > I want my page to be able to alternate between two stylesheets. You
> can read
> > > > the technique here:
> > > > http://www.alistapart.com/stories/alternate/
> > > >
> > > > and examples here: http://www.csszengarden.com/
> > > >
> > > > I've written this using XHTML/CSS and a Javascript styleswitcher (so
> it's
> > > > client side switching)  in the following way:
> > > >
> > > > <link rel="stylesheet" href="styles/bare.css" type="text/css"
> title="Bare"
> > > > media="screen, projection" />
> > > > <link rel="alternate stylesheet" href="styles/blue.css"
> type="text/css"
> > > > title="Blue" media="screen, projection" />
> > > > <script type="text/javascript"
> > > > src="styles/styleswitch.js"></script>
> > > >
> > > > does anybody knows how can (or at least the easiest way) achieve this
> in
> > > > Seaside?
> > > >
> > > > (I´m using Squeak with Seaside 2.61-mb8. I've seen an e-mail from Avi
> Bryant
> > > > from may 2004 but haven't found anything in the SqueakMap and Cincom
> Public
> > > > Repository, any idea?).
> > >
> > > Try the following, add these methods to WAHtmlRoot
> > >
> > > styleElementWithHref: anUrlString titled: aTitleString media:
> aMediaString
> > >         ^(self styleElementWithHref: anUrlString)
> > >                 attributeAt: 'title' put: aTitleString;
> > >                 attributeAt: 'media' put: aMediaString;
> > >                 yourself
> > >
> > > linkToStyle: url titled: aString media: aMediaString
> > >         self addHeadElement:
> > >                 (self
> > >                         styleElementWithHref: (self
> absoluteUrlForResource: url asString)
> > >                         titled: aString
> > >                          media: aMediaString)
> > >
> > > then in your root component class:
> > >
> > > updateRoot: anHtmlRoot
> > >         super updateRoot: anHtmlRoot.
> > >         anHtmlRoot linkToStyle: 'styles/bare.css' titled: 'Bare' media:
> > > 'screen, projection'.
> > >         anHtmlRoot linkToStyle: 'styles/blue.css' titled: 'Blue' media:
> > > 'screen, projection'.
> > >         anHtmlRoot linkToStyle: 'styles/styleswitch.js'
> >
> > The last line should of course read:
> >
> >          anHtmlRoot linkToScript: 'styles/styleswitch.js'
> >
> > Philippe
> > _______________________________________________
> > Seaside mailing list
> > [hidden email]
> >
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
> >
>
>
>
> _______________________________________________
> Seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
>
>
>

_______________________________________________
Seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

StyleDemo-pmm.1.mcz (2K) Download Attachment