Extjs换肤+cookie皮肤记忆功能
http://www.myext.cn/kaifa/a_102.html Ext之家
<title>无标题页</title>
<link rel="Stylesheet" type="text/css" href="http://www.cnblogs.com/ExtJS/resources/css/ext-all.css" />
<link rel="Stylesheet" type="text/css" /> <script type="text/javascript" src="http://www.cnblogs.com/ExtJS/ext-all.js"></script>
<script type="text/javascript" src="http://www.cnblogs.com/ExtJS/ext-lang-zh_CN.js"></script>
</head>
function makeCookie()
{
var themes =
[
['default', '默认'],
['gray', '灰色'],
['green', '绿色'],
['olive', '橄榄绿'],
['pink', '粉色'],
['purple', '紫色'],
['slate', '暗蓝色']
];
var cbThemes = new Ext.form.ComboBox
({
id: 'cbThemes',
store: themes,
width: 80,
typeAhead: true,
triggerAction: 'all',
emptyText:'界面主题',
selectOnFocus:true
});
cbThemes.on
({
"select":function(field,newValue,oldValue)
{
var css = newValue.data.value;
//设置cookies
var date=new Date();
date.setTime(date.getTime()+30*24*3066*1000);
document.getElementsByTagName("link")[1].href=
"http://www.cnblogs.com/ExtJS/resources/css/xtheme-"+css+".css";
document.cookie="css="+css+";expires="+date.toGMTString();
}
});
var win = new Ext.Window
({
title:"测试更换皮肤窗口",renderTo:document.body,width:500,height:300,x:300,y:100,
bbar:['更换皮肤','',cbThemes]
});
win.show();
document.body.onload = function()
{
var cookiesArr=document.cookie.split(";");
var css;
for(var i=0;i<cookiesArr.length;i++)
{
var arr=cookiesArr[i].split("=");
if(arr[0]=="css")
{
css=arr[1];
break;
}
}
document.getElementsByTagName("link")[1].href=
"http://www.cnblogs.com/ExtJS/resources/css/xtheme-"+css+".css";
};
}
Ext.onReady(makeCookie);
Extjs换肤+cookie皮肤记忆功能的更多相关文章
- Extjs grid分页多选记忆功能
很多同事在用extjs grid做分页的时候,往往会想用grid的多选功能来实现导出Excel之类的功能(也就是所谓的多选记忆功能),但在选选择下一页的时候 上一页选中的已经清除 这是因为做分页的时候 ...
- cookie记忆换肤功能实战Demo
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- Android App插件式换肤实现方案
背景 目前很多app都具有换肤功能,用户可以根据需要切换不同的皮肤,为使我们的App支持换肤功能,给用户提供更好的体验,在这里对换肤原理进行研究总结,并选择一个合适的换肤解决方案. 换肤介绍 App换 ...
- jquery换肤
<script src="script/jquery-2.1.0.js"></script> <link href="style/ ...
- 用js来实现页面的换肤功能(带cookie记忆)
用js来实现页面的换肤功能 js实现换肤功能的实现主要是通过利用js控制CSS来实现的.大致的实现原理是这样的, 1.先定义一个页面基本样式style.css来确定div的宽高等属性,使得整个页面的D ...
- cookie换肤功能
<div class="selectSkin"> <input id="red" class="themeBtn" typ ...
- 【转】Javascript+css 实现网页换肤功能
来源:http://www.php100.com/html/webkaifa/DIV_CSS/2008/1014/2326.html Html代码部分: 1.要有一个带id的样式表链接,我们要通过操作 ...
- JS实现网页换肤功能效果
网页换肤的基本原理 使用 JS 切换对应的 CSS 样式表.例如hao123首页的右上方就有网页换肤功能.除了切换 CSS 样式表文件之外,通常的网页换肤还需要通过 Cookie 来记录用户之前更换过 ...
- jquery.cookie中的操作之与换肤
jquery.cookie.js的插件,插件的源代码如下: /** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) ...
随机推荐
- 利用ZjDroid对 <捕鱼达人3> 脱壳及破解过程-转
http://blog.sina.com.cn/zihao2015 <捕鱼达人3> 刚出来不久,就被鬼哥Dump出来dex,随之破解也就轻而易举.一开始我用ZjDroid神器试验过,但是没 ...
- Bootstrap 手风琴搭配导航条实现常用菜单栏
效果 HTML代码 <div class="sidebar"> <div class="mc-search"> <div clas ...
- Naive Bayes在mapreduce上的实现
Naive Bayes是比较常用的分类器,因为思想比较简单.之所以说是naive,是因为他假设用于分类的特征在类确定的条件下是条件独立的,这个假设使得分类变得很简单,但会损失一定的精度. 具体推导可以 ...
- jQuery中的attr()和prop()使用
总结:除了checked.seleted这样的属性推荐用prop()外,其他的随意都可以. 原因如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...
- POJ 2728 Desert King 最优比率生成树
Desert King Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 20978 Accepted: 5898 [Des ...
- iOS常用宏定义
转发:https://www.douban.com/note/486674206/ #ifndef MacroDefinition_h#define MacroDefinition_h //----- ...
- php 中的全局变量的理解
$GLOBALS 是php中的一个全局变量的数组. $GLOBALS['var1'] 代表的是 外部的全局变量 $var1 本身.global $var是外部$var的同名引用或者指针 例1: &l ...
- createNewFile()与createTempFile()的不同
1, File 的 createNewFile() 方法: createNewFile():返回值为 boolean: 方法介绍:当且仅当不存在具有此抽象路径名指定名称的文件时, ...
- 1、下载LInux版的tomcat6
1.下载LInux版的tomcat6 http://mirror.bit.edu.cn/apache/tomcat/tomcat-6/v6.0.37/bin/apache-tomcat-6.0.37. ...
- [Shell]随机数
0-1之间的随机数# awk 'BEGIN{srand();printf "%.16f\n",rand()}' 0-20之间随机数# awk 'BEGIN{srand();sum= ...