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皮肤记忆功能的更多相关文章

  1. Extjs grid分页多选记忆功能

    很多同事在用extjs grid做分页的时候,往往会想用grid的多选功能来实现导出Excel之类的功能(也就是所谓的多选记忆功能),但在选选择下一页的时候 上一页选中的已经清除 这是因为做分页的时候 ...

  2. cookie记忆换肤功能实战Demo

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  3. Android App插件式换肤实现方案

    背景 目前很多app都具有换肤功能,用户可以根据需要切换不同的皮肤,为使我们的App支持换肤功能,给用户提供更好的体验,在这里对换肤原理进行研究总结,并选择一个合适的换肤解决方案. 换肤介绍 App换 ...

  4. jquery换肤

    <script src="script/jquery-2.1.0.js"></script>      <link href="style/ ...

  5. 用js来实现页面的换肤功能(带cookie记忆)

    用js来实现页面的换肤功能 js实现换肤功能的实现主要是通过利用js控制CSS来实现的.大致的实现原理是这样的, 1.先定义一个页面基本样式style.css来确定div的宽高等属性,使得整个页面的D ...

  6. cookie换肤功能

    <div class="selectSkin"> <input id="red" class="themeBtn" typ ...

  7. 【转】Javascript+css 实现网页换肤功能

    来源:http://www.php100.com/html/webkaifa/DIV_CSS/2008/1014/2326.html Html代码部分: 1.要有一个带id的样式表链接,我们要通过操作 ...

  8. JS实现网页换肤功能效果

    网页换肤的基本原理 使用 JS 切换对应的 CSS 样式表.例如hao123首页的右上方就有网页换肤功能.除了切换 CSS 样式表文件之外,通常的网页换肤还需要通过 Cookie 来记录用户之前更换过 ...

  9. jquery.cookie中的操作之与换肤

    jquery.cookie.js的插件,插件的源代码如下: /** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) ...

随机推荐

  1. hide the navigationBar and tabBar

    [self.navigationController setNavigationBarHidden:YES animated:NO]; hidesBottomBarWhenPushed

  2. 在Gridview编辑时添加DropDownList控件并设置默认值

    页面代码: <asp:GridView ID="GridView1" runat="server"             AutoGenerateCol ...

  3. 基于POI的Excel导入导出(JAVA实现)

    今天做了个excel的导入导出功能,在这记录下. 首先现在相关poi的相关jar包,资源链接:http://download.csdn.net/detail/opening_world/9663247 ...

  4. H2Database高级特性

    http://wenku.baidu.com/link?url=mcSOmh5PRsKGO1kXzXqzZVjVPYR5sOWK_KIjw8qdpGHAkZsbWiK71lE9ToYwxLvJwL7b ...

  5. 字符串的妙用之拼出花样的sql

    条件写在前面 string sqlrequirement =""; if(dtp_sta.text==""&&dtp_end.text==&qu ...

  6. Bootstrap的文档大概介绍

    1.预置CSS样式 (1)Normalize.css  增强浏览器表现的一致性. (2)布局容器——版芯:container. ①.container 类用于固定宽度并支持响应式布局的容器.     ...

  7. Python+Selenium+PhantomJS下载JavaScript异步加载网页

    # -*- coding: utf-8 -*- from selenium import webdriver import selenium.webdriver.support.ui as ui fr ...

  8. Windows Azure Table Storage 解决 Guid 查询问题

    在使用 Windows Azure Table Storage 的 CloudTableClient 对Azure 进行数据查询时,会发现在自定义类的Guid类型始终无法去成功查询出数据,对比发现 G ...

  9. CDOJ 1273 God Qing's circuital law

    暴力枚举+idea.做的时候mod写错了,写成了1000000009,找了两个多小时才发现...... a[1],a[2],a[3]....a[N] b[1],b[2],b[3]....b[N] 首先 ...

  10. Nginx日志配置及日志切割

    日志配置 日志对于统计排错来说非常有利的.本文总结了nginx日志相关的配置如access_log.log_format.open_log_file_cache.log_not_found.log_s ...