MacNN Forums (http://forums.macnn.com/)
-   Developer Center (http://forums.macnn.com/developer-center/)
-   -   User switchable CSS? (http://forums.macnn.com/79/developer-center/275374/user-switchable-css/)

 
grovberg Nov 13, 2005 05:14 PM
User switchable CSS?
So how complicated is to implement a button that will let the user switch between two different style sheets? I looked around for a DW behavior with no luck and any sites I've found that have this feature all use javascript libraries that are a bit over my head, but it seems like it shouldn't be that complicated.

Thanks.
 
Tesseract Nov 13, 2005 05:25 PM
How about the ALA style switcher?
 
mania Nov 13, 2005 05:25 PM
i use php to set a couple session vars to change link to style sheet and main header image.
 
- - e r i k - - Nov 13, 2005 07:18 PM
Use the ALA-style switcher as mentioned.

Don't know if this is useful for anyone, but I just put together this bit of php-code to automatically switch stylesheet by date (spring, summer, fall, winter). I couldn't find anything by Googling on this, so I based this of a variable-setting one. It's a bit ugly, but then again I'm not much of a coder:
Code:
<?php       
if(date("n") == 12) {
if(date("j") >= 22):
echo "<link rel=\"stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title\"var\" />";
else:
echo "<link rel=\"stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
endif;
}
if(date("n") >= 1 && date("n") <= 2) {
echo "<link rel=\"stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title\"var\" />";
}
if(date("n") == 3) {
if(date("j") <= 21):
echo "<link rel=\"stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title\"var\" />";
else:
echo "<link rel=\"stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
endif;
}
if(date("n") >=4 && date("n") <= 5) {
echo "<link rel=\"stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
}
if(date("n") == 6) {
if(date("j") <= 21):
echo "<link rel=\"stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
else:
echo "<link rel=\"stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
endif;
}
if(date("n") >= 7 && date("n") <= 8) {
echo "<link rel=\"stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
}
if(date("n") == 9) {
if(date("j") <= 21):
echo "<link rel=\"stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
else:
echo "<link rel=\"stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
endif;
}
if(date("n") >= 10 && date("n") <= 11) {
echo "<link rel=\"stylesheet\" href=\"layout-gold.css\" type=\"text/css\" title=\"host\" />
<link rel=\"alternate stylesheet\" href=\"layout-green.css\" type=\"text/css\" title=\"sommer\" />
<link rel=\"alternate stylesheet\" href=\"layout-spring.css\" type=\"text/css\" title=\"var\" />
<link rel=\"alternate stylesheet\" href=\"layout-blue.css\" type=\"text/css\" title=\"vinter\" />";
}
?>
 
mdc Nov 13, 2005 11:06 PM
my site has a php script with cookies that will remember which style (selectable towards the bottom of the front page) you chose.

if you want the code i'll post it
 
grovberg Nov 14, 2005 02:01 PM
Thanks guys, the ALA thing was just what I was looking for. The PHP stuff won't work since my students don't have access to a PHP server.

Thanks again!
 
mania Nov 14, 2005 08:55 PM
Quote, Originally Posted by grovberg
The PHP stuff won't work since my students don't have access to a PHP server.
hmm thats pretty sad. :cry: :cry:

it comes with OS X you know - but you do have to 'turn it on' by editing a text file (way beyond some people i know).
 
All times are GMT -5. The time now is 06:31 AM.

Copyright © 2005-2007 MacNN. All rights reserved.
Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2013, vBulletin Solutions, Inc.


Content Relevant URLs by vBSEO 3.3.2