JS Code example: Achieve Random Loading of different CSS styles

If you want a webpage viewer to feel new each time they open the page, you can replace the CSS style. Next we will introduce it.

The JS Effect of loading CSS styles randomly is actually very good.CodeThe specific idea is to use a default CSS style: default.css. CSS with three other names: skin1.css, skin2.css, and skin3.css. Of course, you can use more style sheets and then replace them randomly during loading, because the first ult.css style to be loaded is directly written on the page, the CSS files after random loading in JS will overwrite the previous CSS files, as long as the element names in CSS are the same.

VaR init = {
// Style table file directory path
Baseskinurl: "/blog/CSS/skin /",
// List of style sheet file names
Styles: ["default", "skin1", "skin2", "skin3"],
// Key value of the style cookie
Cookiekey: "css9_blog_random_css ",
// Define a method to obtain a random number between min and Max, including Min and Max
Getrandomnum: function (Min, max ){
Return min + math. Floor (math. Random () * (max-min + 1 ));
},
// Define a method to obtain the cookie value
Getcookie: function (name ){
VaR arr = Document. Cookie. Match (New Regexp ("(^ |)" + name + "= ([^;] *) (; | $ )"));
If (Arr! = NULL ){
Return Unescape (ARR [2]);
}
Return NULL;
},
// Define the method and set the cookie value
Setcookie: function (sname, svalue, objhours, Spath, sdomain, bsecure ){
VaR scookie = sname + "=" + encodeuricomponent (svalue );
If (objhours ){
VaR date = new date ();
VaR MS = objhours x 3600*1000;
Date. settime (date. gettime () + MS );
Scookie + = "; expires =" + date. togmtstring ();
}
If (Spath ){
Scookie + = "; Path =" + Spath;
}
If (sdomain ){
Scookie + = "; domain =" + sdomain;
}
If (bsecure ){
Scookie + = "; secure ";
}
Document. Cookie = scookie;
},
// Define a method to randomly load CSS by obtaining a random number
Loadcss: function (){
VaR length = This. Styles. length,
Random = This. getrandomnum (0, length-1 ),
Cookiestyle = This. getcookie (this. cookiekey ),
Currentstyle = "default ";
// If the selected style is the same as that in cookie, the random number is recalculated.
While (this. styles [random] = cookiestyle)
{
Random = This. getrandomnum (0, length-1)
}
Currentstyle = This. styles [random];
// Save the new style to the cookie. The cookie is valid for 24 hours.
This. setcookie (this. cookiekey, currentstyle, 24, "/", "websbook.com", false );
// If the style name is not "default", write the custom style to the If (currentstyle! = "Default ")
{
Document. Write ('<LINK rel = "stylesheet" type = "text/CSS"
Href = "'+ this. baseskinurl + this. styles [random] + '.css"/> ');
}
}
}
Init. loadcss ();