cookie 换肤
jquery.Cookies.js
/**
* Cookie plugin
*
* Copyright (c) 2006 ziqiu.zhang
* Dual licensed under the MIT and GPL licenses:
* http://www.opensource.org/licenses/mit-license.php
* http://www.gnu.org/licenses/gpl.html
* 使用举例:
//注: 写入时,subName参数请传递空值或null
//写入Cookies-值为字符串,即不包含子键
$.cookie("singleKey", "", "singleKey-value", { expires: 1, path: "/", secure: false })
//读取Cookies-根据主键
alert("singleKey:" + $.cookie("singleKey")); //写入Cookies-值为对象,则每个属性名为子键的名称,属性值为子键值
var subNameObj = { subName1: "aaa", subName2: "bbb", subName3: "ccc" };
$.cookie("multiKey", "", subNameObj, { expires: 1, path: "/", secure: false });
//读取Cookies-根据主键
alert("multiKey:" + $.cookie("multiKey"));
//读取Cookies-根据主键和子键
alert("multiKey,subName1:" + $.cookie("multiKey", "subName1"));
*
*/ jQuery.cookie = function(name, subName, value, options) {
if (typeof value != 'undefined') { // name and value given, set cookie
options = options || {};
if (value === null) {
value = '';
options.expires = -1;
}
var expires = '';
if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
var date;
if (typeof options.expires == 'number') {
date = new Date();
date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
} else {
date = options.expires;
}
expires = '; expires=' + date.toUTCString(); // use expires attribute, max-age is not supported by IE
}
// CAUTION: Needed to parenthesize options.path and options.domain
// in the following expressions, otherwise they evaluate to undefined
// in the packed version for some reason...
var path = options.path ? '; path=' + (options.path) : ';path=/';
var domain = options.domain ? '; domain=' + (options.domain) : '';
var secure = options.secure ? '; secure' : ''; //If value is an object, each property will be a sub key;
if (typeof value == "object") {
var k = 0;
var tempResult = "";
for (var tempValue in value) {
if (k > 0) {
tempResult += "&";
}
tempResult += tempValue + "=" + encodeURIComponent(value[tempValue]);
k++;
}
value = tempResult;
} else {
value = encodeURIComponent(value);
} document.cookie = [name, '=', value, expires, path, domain, secure].join('');
} else { // only name given, get cookie
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); //Search sub key
if (typeof subName != 'undefined' && subName != null && subName != "") {
var subCookies = cookieValue.toString().split('&');
for (var j = 0; j < subCookies.length; j++) {
var subCookie = jQuery.trim(subCookies[j]);
if (subCookie.substring(0, subName.length + 1) == (subName + '=')) {
cookieValue = decodeURIComponent(subCookie.substring(subName.length + 1));
break;
}
}
} break;
} }
}
return cookieValue;
}
};
<script type="text/javascript" src="/themes/admin/js/jquery.Cookies.js"></script>
<span><strong class="fl pr" id="colorcsshf"><em class="hticons hticons-hf"></em>换肤 <em class="colorcss defaultcss" onclick="changeTheme('');"></em><em class="colorcss bluecss" onclick="changeTheme('blue');"></em><em class="colorcss greencss" onclick="changeTheme('green');"></em><em class="colorcss yellowcss" onclick="changeTheme('yellow');"></em><em class="colorcss graycss" onclick="changeTheme('gray');"></em></strong><strong class="fl"><em class="hticons hticons-yh"></em>
function getCookie(c_name) {
if (document.cookie.length > 0) { //先查询cookie是否为空,为空就return ""
c_start = document.cookie.indexOf(c_name + "=")
if (c_start != -1) {
c_start = c_start + c_name.length + 1;
c_end = document.cookie.indexOf(";", c_start);
if (c_end == -1) c_end = document.cookie.length;
return unescape(document.cookie.substring(c_start, c_end));
}
}
return "";
}
function setCookie(c_name, value, expiredays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + expiredays);
document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());
}
function loadCss(className, isIframeMenu) {
var container = document;
if (isIframeMenu) {
container = window.frames["ifrmenu"].document;
}
var cssTag = container.getElementById('loadCss');
var head = container.getElementsByTagName('head').item(0);
if (cssTag) head.removeChild(cssTag);
if (className != '') {
css = container.createElement('link');
css.href = '/themes/admin/css/' + className + '.css';
css.rel = 'stylesheet';
css.type = 'text/css';
css.id = 'loadCss';
head.appendChild(css);
}
}
function loadIframeCss(className) {
var cssTag = window.frames["ifrmenu"].document.getElementById('loadCss');
var head = window.frames["ifrmenu"].document.getElementsByTagName('head').item(0);
if (cssTag) head.removeChild(cssTag);
if (className != '') {
css = window.frames["ifrmenu"].document.createElement('link');
css.href = '/themes/admin/css/' + className + '.css';
css.rel = 'stylesheet';
css.type = 'text/css';
css.id = 'loadCss';
head.appendChild(css);
}
}
function changeTheme(className) {
$.cookie('theme', '', className, { expires: 365, path: "/login", secure: false });
$.cookie('theme', '', className, { expires: 365, path: "/", secure: false });
loadCss(className);
loadCss(className,true);
}
blue.css/gray.css/green.css/yellow.css
cookie 换肤的更多相关文章
- cookie换肤功能
<div class="selectSkin"> <input id="red" class="themeBtn" typ ...
- cookie记忆换肤功能实战Demo
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- 用js来实现页面的换肤功能(带cookie记忆)
用js来实现页面的换肤功能 js实现换肤功能的实现主要是通过利用js控制CSS来实现的.大致的实现原理是这样的, 1.先定义一个页面基本样式style.css来确定div的宽高等属性,使得整个页面的D ...
- 网页换肤,模块换肤,jQuery的Cookie插件使用(转)
具体效果如下: 第一次加载如下图: 然后点击天蓝色按钮换成天蓝色皮肤如下图: 然后关闭网页重新打开或者在打开另一个网页如下图: 因为皮肤用Cookie保存了下来,所以不会重置 具体的实现代码如下: & ...
- jquery.cookie中的操作之与换肤
jquery.cookie.js的插件,插件的源代码如下: /** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) ...
- 锋利的jQuery-5--网页换肤
网页换肤原理:通过调用不同的样式表文件来实现不同的皮肤,并且将切换好的皮肤计入cookie. 例子:通过点击上边的颜色设置下边显示的背景色. html代码: <!-- head部分引入的css样 ...
- 【转】Javascript+css 实现网页换肤功能
来源:http://www.php100.com/html/webkaifa/DIV_CSS/2008/1014/2326.html Html代码部分: 1.要有一个带id的样式表链接,我们要通过操作 ...
- js实现换肤效果
一,js换肤的基本原理 基本原理很简单,就是使用 JS 切换对应的 CSS 样式表文件.例如导航网站 Hao123 的右上方就有网页换肤功能.除了切换 CSS 样式表文件之外,通常的网页换肤还需要通过 ...
- Android App插件式换肤实现方案
背景 目前很多app都具有换肤功能,用户可以根据需要切换不同的皮肤,为使我们的App支持换肤功能,给用户提供更好的体验,在这里对换肤原理进行研究总结,并选择一个合适的换肤解决方案. 换肤介绍 App换 ...
随机推荐
- DP:Ant Counting(POJ 3046)
数蚂蚁 题目大意:一只牛想数蚂蚁,蚂蚁分成很多组,每个组里面有很多只蚂蚁,现在问你有多少种组合方式 (说白了就是问1,1,1,...,2...,3...,4...)这些东西有多少种排列组合方式 这一道 ...
- MySQL主备库切换(MHA)演练与总结
演练包括被动切换和主动切换两部分.被动切换是主库宕机,主动切换是人工手动触发. 演练步骤大致如下: 1 先停掉主库,模拟主库宕机 2 mha将vip切到备库,备库变成主库, ...
- 查看LINUX当前负载
Linux的负载高,主要是由于CPU使用.内存使用.IO消耗三部分构成.任意一项使用过多,都将导致服务器负载的急剧攀升. [root@ok Desktop]# w 20:41:47 up 2:48, ...
- select into from 提示 Undeclared variable.....错误的解决办法 && select into from 和 insert into select 的用法和区别
然而今天在使用 SELECT INTO FROM 备份mysql数据表的时候,运行相关 sql 语句的时候却一直返回 [Err] 1327 - Undeclared variable: ...... ...
- IIS7 / IIS7.5 URL 重写 HTTP 重定向到 HTTPS(转)
转自: http://www.cnblogs.com/yipu/p/3880518.html 1.购买SSL证书,参考:http://www.cnblogs.com/yipu/p/3722135. ...
- display : -webkit-box-inline 的理解
发现: 最近在做移动端的东西,说起移动端弹性盒子布局真是无往不利,用起来特别爽,我也是偶尔间发现的这个属性并且它的用法,在网上基本查不到这个属性的资料(个人看法).如果没有听说过(display:bo ...
- jquery easy ui 1.3.4 事件与方法的使用(3)
3.1.easyui事件 easyui事件可以在构建的时候就通过属性方式添加上去,比如在panel收缩的时候添加一个事件,在构建的时候代码如下 onCollapse: function () { al ...
- ubuntu下安装kde Plasma
Ubuntu15.04安装KDE Plasma 5.3桌面环境_百度经验 http://jingyan.baidu.com/article/bad08e1ee280e709c8512185.html ...
- 关于html5不支持frameset的解决方法
转自:http://blog.sina.com.cn/s/blog_b2813a790101ejvf.html html5已经不支持frameset了,很郁闷,看了大家的解决方法,无非就是两种1. 使 ...
- BZOJ 3156: 防御准备 斜率优化DP
3156: 防御准备 Description Input 第一行为一个整数N表示战线的总长度. 第二行N个整数,第i个整数表示在位置i放置守卫塔的花费Ai. Output 共一个整数,表示最小的战 ...