利用link标签rel="alternate&…
来源:互联网 发布:最新赚钱软件 编辑:程序博客网 时间:2024/05/16 09:08
标签
rel="stylesheet"属性指定将一个样式表立即应用到文档.
rel="alternate stylesheet"属性将其作为备用样式表而在默认情况下禁用它
通过js拿到link标签对象,disabled属性设置,可以实现变化页面导入样式表
disabled = true;表示它不会立即生效
disabled = false;表示立即生效
本人用了jquery插件,使用方法如下:
第一步:定义多个样式表:
[html] viewplaincopy
- <</SPAN>link
rel="alternate stylesheet" title="classic" href="css/style0.css" type="text/css" media="screen"/> - <</SPAN>link
rel="alternate stylesheet" title="silver" href="css/style.css" type="text/css" media="screen"/> - <</SPAN>link
rel="stylesheet" title="modern" href="css/style1.css" type="text/css" media="screen"/>
第二步:定义转换按钮:
[html] viewplaincopy
- <</SPAN>p>
-
<</SPAN>button onclick="switchTheme('modern')"><</SPAN>img style="width:126px;height:66px" src="img/t1.png" alt="Modern"/></</SPAN>button> -
<</SPAN>button onclick="switchTheme('silver')"><</SPAN>img style="width:126px;height:66px" src="img/t2.png" alt="Silver"/></</SPAN>button> -
<</SPAN>button onclick="switchTheme('classic')"><</SPAN>img style="width:126px;height:66px" src="img/t3.png" alt="Classic"/></</SPAN>button> - </</SPAN>p>
第三部:定义相关的js
[html] viewplaincopy
- function
switchTheme(t) { -
$('link[title]').each(function(){ -
this.disabled = true; -
this.disabled = (this.title != t); -
}); -
return false; - };
0 0
- 利用link标签rel="alternate&…
- 利用link标签rel="alternate stylesheet"属性实现变化页面导入样式表
- 利用link标签rel="alternate stylesheet"属性实现界面动态换肤
- 利用link标签rel="alternate stylesheet"属性实现界面动态换肤
- 利用link的rel=“alternate stylesheet”实现类似夜间模式的这类换肤功能
- Link 标签 rel="Stylesheet"?
- rel="alternate" 作用
- link rel=”canonical”标签的用法
- <link>标签中的rel="sheetstyle"含义
- <link>标签中的rel="sheetstyle"含义
- HTML link标签 rel 属性
- HTML中a标签的rel属性使用 link标签的rel="search"用法
- link标签的rel=”canonical”的使用
- Link 标签 rel=Stylesheet的实际作用
- link 标签中“rel=stylesheet”的作用
- Link 标签 rel=Stylesheet的实际作用
- Link 标签 rel=Stylesheet的实际作用
- Link 标签 rel=Stylesheet的实际作用
- Solaris10 sparc架构下安装gdb和简单调试
- yii framework(一)入口分析
- PHP中HTTP_HOST和SERVER_NAME的区…
- ubuntu系统下新设备在adb devices下找不到的解决方案二
- Emoji表情符号兼容方案
- 利用link标签rel="alternate&…
- js更换样式及cookie设置相关js方法
- Linux scp 使用详解
- 一些疑问留存
- php get_magic_quotes_gpc()…
- MySQL中的datetime与timestamp比较
- Redis pub/sub(Publish,Subsc…
- 如何理解云计算
- Redis的函数---解析