欢迎来到福编程网,本站提供各种互联网专业知识!

用cookies实现的可记忆的样式切换效果代码下载

发布时间:2007-12-24 作者: 来源:转载
比较不错的用cookies实现的可记忆的样式切换效果,这个思路也在一定程序,方便客户的长期使用。
无刷新cookies切换样式示例代码实例主要用到的代码
复制代码 代码如下:



styleswitcher全福编程网-www.jb51.net





red
blue
<selectname="changestyle"size="1">
red
blue


left


right



styleswitcher.js
复制代码 代码如下:
//styleswitcher.js

functionsetActiveStyleSheet(title)
{
vari,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("title")==title)
a.disabled=false;
}
}
}

functiongetActiveStyleSheet()
{
vari,a;

for(i=0;(a=document.getElementsByTagName("link")[i]);i++)
{
if(a.getAttribute("rel").indexOf("style")!=-1&&
a.getAttribute("title")&&!a.disabled)
returna.getAttribute("title");
}

returnnull;
}

functiongetPreferredStyleSheet()
{
vari,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"))
returna.getAttribute("title");
}

returnnull;
}

functioncreateCookie(name,value,days)
{
if(days)
{
vardate=newDate();
date.setTime(date.getTime()+(days*24*60*60*1000));
varexpires=";expires="+date.toGMTString();
}

elseexpires="";
document.cookie=name+"="+value+expires+";path=/";
}

functionreadCookie(name)
{
varnameEQ=name+"=";
varca=document.cookie.split(';');

for(vari=0;i{
varc=ca[i];

while(c.charAt(0)=='')
c=c.substring(1,c.length);

if(c.indexOf(nameEQ)==0)
returnc.substring(nameEQ.length,c.length);
}

returnnull;
}

window.onload=function(e)
{
varcookie=readCookie("style");
vartitle=cookie?cookie:getPreferredStyleSheet();

setActiveStyleSheet(title);
}

window.onunload=function(e)
{
vartitle=getActiveStyleSheet();

createCookie("style",title,365);
}

varcookie=readCookie("style");
vartitle=cookie?cookie:getPreferredStyleSheet();
setActiveStyleSheet(title);

red.css
复制代码 代码如下:
#left{background-color:#0000FF;float:right;}

red.css
复制代码 代码如下:
#left{background-color:#FF0000;float:left;}

相关推荐