快捷導(dǎo)航

jquery cookie實(shí)現(xiàn)的簡單換膚功能適合小網(wǎng)站

更新時(shí)間：2013年08月25日 13:01:33 作者：

使用jquery cookie做了一個(gè)簡單的換膚功能適合小網(wǎng)站并且代碼低級，具體實(shí)現(xiàn)過程如下，感興趣的朋友可以了解下

前段時(shí)間試著使用jquery cookie的時(shí)候，做了一個(gè)簡單的換膚功能，只適合小網(wǎng)站并且代碼低級。

首先引入jquery和cookie插件

 
<script type="text/javascript" src="__PUBLIC__/js/jquery.js"></script> 
<script type="text/javascript" src="__PUBLIC__/js/cookie.js"></script> 

準(zhǔn)備幾個(gè)css文件

復(fù)制代碼代碼如下:

網(wǎng)頁中的body部分準(zhǔn)備幾個(gè)button按鈕用于觸發(fā)jquery

復(fù)制代碼代碼如下:

jquery代碼

復(fù)制代碼代碼如下:

 
$(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"; //沒有設(shè)置，讀取默認(rèn)css 
} 
else 
{ 
var cssfile="__PUBLIC__/css/"+file; //設(shè)置過的cookie 
} 
$("#f").attr("href",cssfile); 
} 
); 

點(diǎn)擊獲取jquery cookie插件
點(diǎn)擊獲取jquery或者使用jquery在谷歌或者微軟的托管
Microsoft CDN:
-------------------------------------------------------------------------------

復(fù)制代碼代碼如下:

Google CDN:
--------------------------------------------------------------------------------

復(fù)制代碼代碼如下:

 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"> </script> 

您可能感興趣的文章:

相關(guān)文章

把jquery 的dialog和ztree結(jié)合實(shí)現(xiàn)步驟
首先準(zhǔn)備好juqury-ui、ztree 的js文件和css 文件，接下來的步驟祥看本文希望對大家有所幫助
2013-08-08
jquery項(xiàng)目中如何防重復(fù)提交詳解
客戶端的抖動(dòng),快速操作,網(wǎng)絡(luò)通信或者服務(wù)器響應(yīng)慢,都容易造成服務(wù)器重復(fù)處理,這篇文章主要給大家介紹了關(guān)于jquery項(xiàng)目中如何防重復(fù)提交的相關(guān)資料,需要的朋友可以參考下
2021-11-11
jQuery EasyUI之驗(yàn)證框validatebox實(shí)例詳解
本文通過實(shí)例代碼給大家講解了jQuery EasyUI之驗(yàn)證框validatebox知識(shí)，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下吧
2017-04-04
jQuery 實(shí)現(xiàn)鼠標(biāo)畫框并對框內(nèi)數(shù)據(jù)選中的實(shí)例代碼
本文通過實(shí)例代碼給大家介紹了jQuery 實(shí)現(xiàn)鼠標(biāo)畫框并對框內(nèi)數(shù)據(jù)選中的實(shí)例代碼，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
2017-08-08
基于jquery的動(dòng)畫效果代碼
基于jquery的動(dòng)畫效果代碼，挺有意思的，需要的朋友可以參考下
2012-07-07
JQuery判斷HTML元素是否存在的兩種解決方法
本篇文章主要是對JQuery判斷HTML元素是否存在的兩種解決方法進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
ajax 提交數(shù)據(jù)到后臺(tái)jsp頁面及頁面跳轉(zhuǎn)問題
這篇文章主要介紹了ajax 提交數(shù)據(jù)到后臺(tái)jsp頁面及頁面跳轉(zhuǎn)問題的相關(guān)資料,需要的朋友可以參考下
2017-01-01
jQuery.extend 函數(shù)的詳細(xì)用法
jQuery.extend 函數(shù)的詳細(xì)用法，學(xué)習(xí)jquery的朋友可以參考下
2012-06-06
jquery1.83 之前所有與異步列隊(duì)相關(guān)的模塊詳細(xì)介紹
jQuery在1.5引入了Deferred對象（異步列隊(duì)），當(dāng)時(shí)它還沒有劃分為一個(gè)模塊，放到核心模塊中。直到1.52才分割出來
2012-11-11
在jQuery1.5中使用deferred對象著放大鏡看Promise
在那篇經(jīng)典的關(guān)于jQuery1.5中Deferred使用方法介紹的文章中（譯文見這里），有下面一段描述
2011-03-03