SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Feb 2004
    Location
    Cambridge, England
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    alternate styleswitcher

    I'm trying to implement the alternate styleswitcher tutorial at:-

    http://www.alistapart.com/stories/alternate/

    I've provided a link on page0.html and page1.html which allows the user to select an alternate stylesheet which changes the background colour. This works and switches back to the default stylesheet OK. However, if you then move to a different page (page0.html or page1.html), either no stylesheet is applied to that page. Unfortunately, I don't know enough about javascript to know if the cookie settings are correct.

    Can anyone help? I'd very much appreciate it. I've included the zipped folder below.

    Thanks in advance.
    Attached Files Attached Files

  2. #2
    SitePoint Evangelist
    Join Date
    Dec 2004
    Posts
    419
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've just extracted your zip file and tested it out in Firefox and IE6, and it works fine. Moving between page0 and page1 keeps the style settings...

  3. #3
    SitePoint Zealot
    Join Date
    Feb 2004
    Location
    Cambridge, England
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Many thanks for trying it out. I'm using a Mac. If I use Firefox, and I switch between pages, then the page that I've switched to does not have any stylesheet applied to it. If I use Safari and switch between pages, then the switched page shows the default style of grey background.

    I've just been able to check on Windows. Opera and Firefox render perfectly. IE6 shows initial grey background correctly when loading. If the alternate stylesheet with red background is selected, then only half the page is shown as red, the rest is grey. IE7 shows the same as IE6. The only difference is that if half the page is shown as red and then a new page is selected, then the new page shows all the selected background colour.

    It's a mystery. I'll have another look in the morning. Any other input would be much appreciated.

    Many thanks.

  4. #4
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    To stop the colour being applied to only half the page, try applying it to both the root element and the body:
    Code:
    html, body {background-color:red}
    I'm not sure if that'll solve the problem though.

    If you have access to a server-side language this would be more robust and would not depend on browser compatibility. It would be very easy to do and would not require setting cookies (except for a session cookie). If you don't, then lovely JavaScript remains the best option.

    Your cookie code seems fine and this works in Safari 3 on Windows. Are you using Safari 2 on the Mac?

  5. #5
    SitePoint Zealot
    Join Date
    Feb 2004
    Location
    Cambridge, England
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks very much for your suggestions. I have tried another Javascript switcher which is much more robust at:

    http://www.alistapart.com/articles/bodyswitchers

    On Windows the only browser that it doesn't work properly is IE6. When you switch between browsers, it reverts to the default style. It works in IE7, Firefox, Opera and Safari.

    On the Mac, it works in Firefox and in Safari 3, it behaves as it does in IE6.

    As you said, probably the only foolproof method is to use a PHP script, but I'll see how I go with this for the time being.

    Thanks again.
    Attached Files Attached Files


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •