I need help writing a persistent stylesheet switcher. I have found an article on ALA but for whatever reason I cannot get it to work!
I have three stylesheets, the default one for the layout and another two which the user will switch between (adjusting the colours). I may later add one for print but I am not there yet.
The style switcher javascript file can be found here http://www.alistapart.com/d/alternate/styleswitcher.js
I have this in the <head>
of my page at the moment.
<script type="text/javascript" src="js/styleswitcher.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="alternate stylesheet" type="text/css" href="css/alt_style1.css" title="purple" />
<link rel="alternate stylesheet" type="text/css" href="css/alt_style2.css" title="red" />
I want the user's selection to be stored in a cookie so that it can be remembered.
The links that select the different stylesheets, in my <body>
tag look like this.
<a href="#" onclick="setActiveStyleSheet('purple'); return false;">purple</a>
<a href="#" onclick="setActiveStyleSheet('red'); return false;">red</a>
I really don't know what I am doing wrong. The stylesheet doesn't change. See it in action here - or not as the case is!