jquery cookie實現的簡單換膚功能適合小網站_jquery

前段時間試著使用jquery cookie的時候，做了一個簡單的換膚功能，只適合小網站並且程式碼低階。

首先引入jquery和cookie插件

複製代碼 代碼如下:

準備幾個css檔案

複製程式碼 程式碼

複製程式碼

程式碼

網頁中的body部分準備幾個button按鈕用來觸發jquery 複製程式碼

程式碼如下:

風格一風格二

jquery代碼複製代碼

程式碼如下:


$(document).ready(function(){
$("#button1").click(
function(){
$. cookie('cssfile','basic2.css');//存入cookie
location.reload(); //刷新頁面
}
);
$("#button2") .click(
function(){
$.cookie('cssfile','basic.css');
location.reload();
}
);
} );
$(document).ready(
function(){
var file=$.cookie('cssfile'); //讀取cookie
if(typeof file=="undefined ")
{
var cssfile="__PUBLIC__/css/basic2.css"; //沒有設置，讀取預設css
}
else
{
var cssfile=" __PUBLIC__/css/" file; //設定的cookie
}
$("#f").attr("href",cssfile);

}
);
點擊取得jquery cookie外掛程式

點擊取得jquery
或使用jquery在Google或微軟的託管

Microsoft CDN: ---- -------------------------------------------------- ------------------------- 複製程式碼

程式碼如下:

Google CDN: ---------------------------------------- ---------------------------------------- 複製程式碼

程式碼如下: