`
wodamazi
  • 浏览: 1420368 次
文章分类
社区版块
存档分类
最新评论

如何动态更换CSS皮肤!

 
阅读更多

现在我有几个CSS的皮肤样式,要通过一个下拉列表框中选择其中的样式进行更换,不知道怎样实现,请高人指教,真诚的谢谢!最好详细举例!
<link href="skins/yellow/yellow.css" rel="stylesheet" type="text/css" id="cssfile" />
刚开始的时候要给link命名id="cssfile",然后加上下面的就行了,其实就是更换样式表;

JS:
<script language="javascript">
 function changestyle(name){
 css=document.getElementById("cssfile");
 css.href="skins/"+name+"/"+name+".css";
 document.all.sel.options[0].selected=true;
 }
</script>

select:
<select name="sel" onchange="changestyle(this.options[this.options.selectedIndex].value)">  
  <option value="base">请选择</option>  
  <option value="base">经典蓝</option> 
  <option value="black">冷酷黑</option>
  <option value="yellow">秋天黄</option>
  <option value="blue">蓝色的</option>
</select> 
分享到:
评论

相关推荐

    css动态更换皮肤

    css级联样式动态更换皮肤,用户可以根据自己的喜好选择自己喜欢的风格

    实时切换css风格、皮肤并保存

    实时切换css风格、皮肤并保存 javascript+css实时切换网页风格、皮肤,并存入cookie,效果不错,代码简洁,欢迎参考

    ExtJS之实现华丽的皮肤主题更换

     把皮肤文件解压 把css文件 如xtheme olive css 拷贝到extjs的resources目录下css文件夹里面:"&gt;extjs的默认皮肤很好看 但是我们还可以变换样式切换其他皮肤  1 直接添加其他css文件换肤 好多皮肤上网就可以收到的...

    ASP、PHP与javascript根据时段自动切换CSS皮肤的代码

    一个网站能切换不同的CSS风格大家应该都了解,像众所周知的腾讯在今年改版时也增加了切换皮肤的功能。

    css+js网页颜色、皮肤多风格切换演示

    css+js网页颜色、皮肤多风格切换演示

    C# 皮肤更换教程和酷炫皮肤源码例子文件 【打包下载】

    C# 皮肤更换教程和酷炫皮肤源码例子文件 【打包下载】 不要白不要

    JavaScript实现无刷新切换网页的CSS文件.rar

    利用JavaScript实现无刷新切换网页的CSS文件,以达到无刷新切换风格的目的,也就是大家俗说的“换肤”特效原理当然是利用JS在客户端执行的特性重载不同的CSS文件,来实现网页风格的变化,CSS文件需要WEB开发者事先...

    Dwrcss皮肤切换

    css皮肤切换

    Ext皮肤更换

    EXT更换皮肤下载了,可利用更改的CSS和图片来更换你的CSS皮肤样式

    CSS3手表倒计时动画 可自定义主题皮肤

    早段时间,我们为大家分享过一些比较炫酷和实用的时钟手表插件,比如这款纯CSS3 3D立体圆盘时钟...今天我们要利用CSS3来实现一个手表样式的倒计时动画,功能相对比较简单,最大的特点在于可以切换4种不同的主题皮肤。

    cookie,dom,css,js实现页面换肤

    &lt;link href="css/main0.css" rel="stylesheet" type="text/css" id="cssfile" /&gt; 2.皮肤选择按钮(后台为每个li添加onclick事件,触发换肤功能) &lt;ul id="skin"&gt; 灰色"&gt;灰色 绿色"&gt;绿色 黄色"&gt;黄色 蓝色"&gt;蓝色 粉色"&gt;...

    js 实现皮肤切换

    javascript 实现动态加载不同的css,实现页面风格的切换

    QT自定义精美换肤界面(主题资源CSS暗黑风格)源码可用

    QT自定义精美换肤界面,主题资源CSS(暗黑风格)源码亲测可用 引用简单: QFile file(QString("./css/%1.css").arg("stylesheet")); file.open(QFile::ReadOnly); QString qss = QLatin1String(file.readAll()); ...

    网页换肤(DIV+CSS)

    实现网页的皮肤更换 &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"&gt; &lt;!-- saved from url=(0036)...

    如何修改moodle_theme主题皮肤.docx

    如何修改moodle_theme主题皮肤.docx如何修改moodle_theme主题皮肤.docx如何修改moodle_theme主题皮肤.docx如何修改moodle_theme主题皮肤.docx如何修改moodle_theme主题皮肤.docx如何修改moodle_theme主题皮肤.docx

    js仿百度切换皮肤功能(html+css)

    js仿百度切换皮肤效果:(换肤出来一个div,选择你想要的图片,作为网页背景,保存)  要点:cookie保存状态 html代码: &lt;body&gt; &lt;div class=dbg&gt;&lt;a&gt;换肤&lt;/a&gt;&lt;/div&gt; &lt;div id=title1&gt;&lt;

    Tab可切换皮肤的后台模板.rar

    本人的CSS和JAVASCIRPT的功底有限,开发的东西难免会有些BUG或者很肤浅的地方,希望和朋友们一起探讨解决其中的一些问题。也非常希望高手们优化我JS。 QQ:10646337,接头暗号:“为人民服务” 我不回答任何提问,只...

    利用JS实现网页换皮肤效果

    利用JS实现网页换皮肤效果,原理:利用JS调用不同CSS,来实现网页风格的变化。

Global site tag (gtag.js) - Google Analytics