zoukankan      html  css  js  c++  java
  • 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,
            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,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);

  • 相关阅读:
    Ecshop支持用户名、邮箱或手机号码登录
    Ecshop模板在首页调用指定分类的热销、推荐、新品商品
    使用JQuery的全屏背景图片,自动适应各种屏幕和浏览器
    浏览器左下角提示网页上有错误解决方法
    设为首页、加入收藏
    Flash遮住Div的解决办法
    谷歌站内搜索的两种方式
    网页内插入百度、谷歌搜索引擎
    CSS透明滤镜
    Eclipse无Server或者Tomcat8.5解决办法
  • 原文地址:https://www.cnblogs.com/koleyang/p/4707451.html
Copyright © 2011-2022 走看看