教你如何更换Extjs皮肤.docVIP

教你如何更换Extjs皮肤 目标： ????? 了解3种办法更换皮肤 内容： ?????? 1，直接在当前浏览器更换皮肤 ?????? 2，在当前浏览器更换皮肤并保存到cookle ?????? 3，在当前浏览器更换皮肤并保持到config文件 　　?? 1.直接添加其他css文件换肤.????????? 皮肤文件:xtheme-olive.zip下载????????? 把皮肤文件解压,把css文件(如xtheme-olive.css)拷贝到extjs的resources目录下css文件夹里面: ????????? 解压皮肤文件,把里面的相应的 image文件夹下的目录(比如olive)拷贝到extjs的resources目录下images文件夹下 设置css文件如下: 其实就是在原有的基础上添加了个xtheme-olive.css文件。 定义Store var themes = [??????????? [默认, ext-all.css],??????????? [紫色, xtheme-purple.css],??????????? [橄榄色, xtheme-olive.css],??????????? [暗蓝色, xtheme-slate.css],??????????? [浅灰色, xtheme-darkgray.css],??????????? [绿色, xtheme-gray.css],??????????? [椒盐色, xtheme-galdaka.css],??????????? [粉色, xtheme-pink.css],??????????? [靛青色, xtheme-indigo.css],??????????? [深夜, xtheme-midnight.css],??????????? [银白色, xtheme-silverCherry.css]????????? ];????????? var Mystore=new Ext.data.SimpleStore({??????????? fields:[theme,css],??????????? data:themes????????? }); ???????? 定义下拉列表框： ???????? var Mycombo=new Ext.form.ComboBox({??????????????????? fieldLabel:更换皮肤,??????????????????? id:css,??????????????????? triggerAction:all,??????????????????? store:Mystore,??????????????????? displayField:theme,??????????????????? valueField:css,??????????????????? value:默认,??????????????????? mode:local,??????????????????? anchor:95%,??????????????????? handleHeight:10,??????????????????? resizable:true,??????????????????? selectOnfocus:true,??????????????????? typeAhead:true????????? });????????? Mycombo.on //定义事件??????????? ({??????????????? select:function()??????????????????????? {?????????????????????????? var css =?? Mycombo.getValue();?????????????????????????? //设置cookies?????????????????????????? var date=new Date();?????????????????????????? //alert(css);?????????????????????????? date.setTime(date.getTime()+30*24*3066*1000);?????????????????????????? document.getElementsByTagName(link)[1].href=ext-3.2.0/resources/css/+css;?????????????????????????? document.cookie=css=+css+;e