js css 仿QQ网站换肤效果代码
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>js css 仿qq网站换肤效果代码</title>
<script language="网页特效">
//设置cookie,按钮选中状态,页面皮肤
skin.setskin=function(n){
var skins =("skin").getelementsbytagname("li");
for (i=0;i
{
skins[i].classname="";//初始化按钮状态
}
skin.setcookie(n);//保存当前样式
("skin_"+n).classname="selected";//设置选中皮肤按钮的样式
("cssfile").href="css/main"+n+".css";//设置页面样式
}//cookie
skin.setcookie=function(n){
var expires=new date();
expires.settime(expires.gettime()+24*60*60*365*1000);
var flag="skin_cookie="+n;
document.cookie=flag+";expires="+expires.togmtstring();
}
//返回用户设置的皮肤样式
skin.readcookie=function(){
var skin=0;
var mycookie=document.cookie;
var name="skin_cookie";
var start1=mycookie.indexof(name+"=");
if(start1==-1){
skin=0;//如果没有设置则显示默认样式
}
else{
var start=mycookie.indexof("=",start1)+1;
var end=mycookie.indexof(";",start);
if(end=-1){
end=mycookie.length;
}
var values= unescape(mycookie.substring(start,end));
if (values!=null)
{
skin=values;
}
}
return skin;
}//js换肤事情
skin.addevent=function(){
var skins =("skin").getelementsbytagname("li");
for (i=0;i
{
skins[i].onclick=function(){skin.setskin(this.id.substring(5))};
}
}//加载效果
window.onload=function(){
skin.setskin(skin.readcookie());//根据读取cookie返回值设置皮肤样式
skin.addevent();//绑定按钮事件
</script>
</head><body>
<ul id="skin">
<li id="skin_0" title="灰色">灰色li>
<li id="skin_1" title="绿色">绿色li>
<li id="skin_2" title="黄色">黄色li>
<li id="skin_3" title="蓝色">蓝色li>
<li id="skin_4" title="粉色">粉色li>
<li id="skin_5" title="紫色">紫色li>
<ul></body>
</html>