How was this done in CSS?

cpals

Diamond Member
Mar 5, 2001
4,494
0
76
I want to have something similar on a project for school and was wonderin how it was done.

The site is: http://www.csszengarden.com/

I'm interested in the part where you can choose which CSS you want to use. Is there a separate page for each style sheet or is it dynamically changed? How do they keep the continuing pages to remember which style sheet the user chose?
 

her209

No Lifer
Oct 11, 2000
56,336
11
0
If you look in the HTML code, you will see that they link to the CSS file:

<style type="text/css" title="currentStyle">
@import "/001/001.css";
</style>
 

cpals

Diamond Member
Mar 5, 2001
4,494
0
76
That doesn't answer my question though... what you gave me is just the standard CSS importing code. If you click on the right, the page stays the same, but the css code changes. I just want to know how they did it.

Maybe a better example: http://www.elenor.net/skin.html

If you click on one of the skins it changes to it and then you can click the same links on the right and they will remain the same style, but yet the pages seem to have the same linking.
 

Bullhonkie

Golden Member
Sep 28, 2001
1,899
0
76
No, the content is all the same. It just applies a different style sheet for each 'theme/layout'. Can be done with Javascript if you want it user-selectable. Some sites have it randomized to choose a random one each time you visit, that could be done any number of ways client-side or server-side (javascript, ssi, php, etc).

http://desktopian.org has a clean but well-done color scheme selector in my opinion.

Edit: Just thought I'd add, it's a good way to make printer-friendly versions of pages also. A separate style sheet strips out all the unnecessary layout and colors while leaving just the content intact and that way, users aren't stuck printing out a lot of junk they don't need. This is why, if you're forward-thinking, it's very important to design websites that have content and design completely separated.
 

cpals

Diamond Member
Mar 5, 2001
4,494
0
76
Originally posted by: Bullhonkie
No, the content is all the same. It just applies a different style sheet for each 'theme/layout'. Can be done with Javascript if you want it user-selectable. Some sites have it randomized to choose a random one each time you visit, that could be done any number of ways client-side or server-side (javascript, ssi, php, etc).

Yes, I want it user-selectable. That is my whole question, how can I do this (with javascript for example)? Is there a place that has a tutorial or examples?

Thanks.
 

Tetsuo

Lifer
Oct 20, 2002
10,908
13
81
Originally posted by: cpals
Originally posted by: Bullhonkie No, the content is all the same. It just applies a different style sheet for each 'theme/layout'. Can be done with Javascript if you want it user-selectable. Some sites have it randomized to choose a random one each time you visit, that could be done any number of ways client-side or server-side (javascript, ssi, php, etc).
Yes, I want it user-selectable. That is my whole question, how can I do this (with javascript for example)? Is there a place that has a tutorial or examples? Thanks.

www.hotscripts.com ,search there.
 

cpals

Diamond Member
Mar 5, 2001
4,494
0
76
I found two places at hotscripts... one was dead and the other one charged $20. :(