Well, if you've got it working without cookies, you just need to know how to use cookies and the rest should be easy. Use the functions in the link which makes it easy to create, read and delete cookies. Either use links or buttons to create them. Just store the name of the stylesheet.
Read through and try your hand at it. If you get stuck, post your code.
Hi
I am sending my code plz. check it and reply me.
/----------------------------------------------------------------------------------
[HTML]<html>
<head>
<title>css change</title>
<link rel="stylesheet" type="text/css" href="new.css" title="Red" />
<link rel="stylesheet" type="text/css" href="new1.css" title="Gray" />
<script type="text/javascript">
function setActivestylesheet(newStyle) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++)
{
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title"))
{
a.disabled = true;
if(a.getAttribute("href") == newStyle)
{
a.disabled = false;
//Next section creates the cookie.
var days=365;
var name="Style";
var value=a.getAttribute("title");
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = ";
expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+"; path=/new1.css";
}
}
}
}
window.onload = function(e) {
var cookie = readCookie("Style");
if (cookie == null) {
createCookie('Style', 'Red', '365');
}
return null;
}
function readCookie(name) {
var nameEQ = name + "=";
var temp = document.cookie;
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function createCookie(name, value, days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else expires = "";
var temp = name+"="+value+expires+"; path=/new1.css";
document.cookie = temp;
}
function setActiveStyleSheet(newStyle) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++)
{
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title"))
{
a.disabled = true;
if(a.getAttribute("href") == newStyle)
{
a.disabled = false;
//Next section creates the cookie.
var days=365;
var name="Style";
var value=a.getAttribute("title");
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = ";
expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+"; path=/new1.css";
//Above section creates the cookie
}
}
}
}
function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
}
return title;
}
function getPreferredStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("rel").indexOf("alt") == -1
&& a.getAttribute("title")
)
{
return a.getAttribute("title");
}
}
//return null;
}
window.unload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}
</script>
</head>
<body>
<a href="#" onclick="setActivestylesheet('new.css'); return false;">change style to default</a>
<a href="#" onclick="setActivestylesheet('new1.css'); return false;">change style </a>
<p class="aStyleClass1">Change Style</p>
</body>
</html>[/HTML]
/------------------------------------------------------------------------------------------------
30
