Смяна на дизайна с JavaScript & Cookie

Ето как може да си сменяте дизайна на сайта – пример с 3-те начина: radio, select & link!

<html>
<head>
<link rel="stylesheet" type="text/css" href="default.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="blue-theme" href="user.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="brown-theme" href="user2.css" />
<script src="styleswitch.js" type="text/javascript">
/***********************************************
* Style Sheet Switcher v1.1- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/
</script>
</head>

<body>
<table width=100%>
<tr>
<td align=center width=33%>
<form id="switchform">
<input type="radio" name="choice" value="none" onClick="chooseStyle(this.value, 60)">Default style<br />
<input type="radio" name="choice" value="blue-theme" onClick="chooseStyle(this.value, 60)">Blue Theme<br />
<input type="radio" name="choice" value="brown-theme" onClick="chooseStyle(this.value, 60)">Brown Theme
</form>
// Rest of body here
</td>


<td align=center width=34%>
<form id="switchform">
<select name="switchcontrol" size="1" onChange="chooseStyle(this.options[this.selectedIndex].value, 60)">
<option value="none" selected="selected">Default style</option>
<option value="blue-theme">Blue Theme</option>
<option value="brown-theme">Brown Theme</option>
</select>
</form>
// Rest of body here
</td>


<td align=center width=33%>
<a href="javascript:chooseStyle('none', 60)" checked="checked">Default style</a><br />
<a href="javascript:chooseStyle('blue-theme', 60)">Blue theme</a><br />
<a href="javascript:chooseStyle('brown-theme', 60)">Brown theme</a><br /><br />
// Rest of body here
</td>
</tr>
</table>
</body>
</html>

Файлове:

• styleswitch.js
• default.css
• user.css
• user2.css

Style Sheet Switcher (v1.1) – http://www.dynamicdrive.com/dynamicindex9/stylesheetswitcher.htm