随机载入CSS样式的JS效果实际上很好实现本文的代码如下具体思路是用一个默认的CSS样式defaultcss另外再用三个其他名称的CSSskincssskincssskincss当然你可以用更多的样式表随后在载入时进行随机替换因为最先载入的defaultcss样式是直接写在
随机载入CSS样式的JS效果实际上很好实现本文的代码如下具体思路是用一个默认的CSS样式defaultcss另外再用三个其他名称的CSSskincssskincssskincss当然你可以用更多的样式表随后在载入时进行随机替换因为最先载入的defaultcss样式是直接写在页面上而JS随机载入的后面CSS文件会覆盖之前的CSS只要CSS中的元素名称相同即可
var Init = {
//样式表文件目录路径
baseSkinUrl : "/blog/css/skin/"
//样式表文件名称列表
styles : ["default" "skin" "skin" "skin"]
//样式cookie的key值
cookieKey : "css_blog_random_css"
//定义方法获取min至max间的随机数包含min及max
getRandomNum : function(min max){
return min + Mathfloor(Mathrandom() * (max min + ));
}
//定义方法获取cookie值
getCookie : function(name) {
var arr = documentcookiematch(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
if (arr != null) {
return unescape(arr[]);
}
return null;
}
//定义方法设置cookie值
setCookie : function(sNamesValueobjHourssPathsDomainbSecure){
var sCookie = sName + "=" + encodeURIComponent(sValue);
if (objHours) {
var date = new Date();
var ms = objHours * * ;
datesetTime(dategetTime() + ms);
sCookie += ";expires=" + datetoGMTString();
}
if (sPath) {
sCookie += ";path=" + sPath;
}
if (sDomain) {
sCookie += ";domain=" + sDomain;
}
if (bSecure) {
sCookie += ";secure";
}
documentcookie=sCookie;
}
//定义方法通过获取随机数随机加载CSS
loadCSS : function(){
var length = thisstyleslength
random = thisgetRandomNum( length)
cookieStyle = thisgetCookie(thiscookieKey)
currentStyle = "default";
//如果当前随机取到的样式与cookie中样式相同则重新计算随机数
while(thisstyles[random] == cookieStyle)
{
random = thisgetRandomNum( length)
}
currentStyle = thisstyles[random];
//将新样式存入cookiecookie有效时间为小时
thissetCookie(thiscookieKey currentStyle "/" "websbookcom" false);
//若样式名称不为"default"默认样式则向<head />标签中写入定制样式
if(currentStyle != "default")
{
documentwrite(<link rel="stylesheet" type="text/css"
href=" + thisbaseSkinUrl + thisstyles[random] + css" />);
}
}
}
InitloadCSS();
