jquery更换css皮肤 changecss(str)函数 - TOMMYHU - 专注互联网开发及运营技术,提供相关资料及软件下载,奇趣网络时事评论!
Jan 20

jquery更换css皮肤 changecss(str)函数 不指定

tommyhu , 08:07 , 大前端 » CSS3 , Comments(2) , Trackbacks(0) , Reads(13593) , Via Original Large | Medium | Small

模板的换皮肤的功能.需要jquery及jquery的cookie插件

css我都放在不同的目录下比如

style1/index.css

style2/index.css

图片在相应的文件夹下,这样我们只要改相应的图片就可以修改掉了,不用更改css
.

我们换皮肤的时候只要把style1改成style2
目标就可以达到了换皮肤的功能

我们要换皮肤一下要有onclick的js事件

我们这里定义了function
changecss(str)函数

html的代码:
代码:
<a onclick=”changecss(’style1′)”
class=”bai” href=”#”>&nbsp;</a>
<a
onclick=”changecss(’style2′)” class=”orange”
href=”#”>&nbsp;</a>
<a onclick=”changecss(’style3′)”
class=”blue” href=”####”>&nbsp;</a>
<a
onclick=”changecss(’style4′)” class=”green” href=”####”>&nbsp;</a>
html 还有个css的连接文件:<link
href=”http://www.125job.com/style/person/style4/index.css” rel=”stylesheet”
type=”text/css” media=”screen” id=”skin”/>

我这里是:
js代码
代码:
function changecss(str) {
var csshref
//当义变量
csshref=$("#skin").attr("href")
//取得skin的css链接
csshref=csshref.replace(/style[0-9]/g,str);
//把原来路径的style1替换成我们自己的str
csshref=$("#skin").attr("href",csshref)  
//改变一下href属性其实这里已经完成
$.cookie("css_skin",str)
//这里是记录一下cookie,防止刷新就回到原来的css路径
}
好了,点击换皮肤已经好了,不过还有个加载的时候读取cookie里的路径
用jquery就简单多了:
加载时候读取路径代码:  
代码:

$(function()
{
  
//如果cookie不为空的时候就读取cookie的路径
   if($.cookie("css_skin")!=null)
  
{
changecss($.cookie("css_skin"));
   }
  
这里就已经全部完成

}
)

▲返回顶部

互联网开发网友 Email Homepage
2012/01/06 00:29
好的,真长见识了,说得很有道理
互联网开发网友 Email Homepage
2011/01/26 11:39
马上要过年了,不知道博主是否需要长途漫漫的赶路,祝福一下,我们还没放假
Pages: 1/1 First page 1 Final page
Add a comment

Nickname

emotemotemotemotemotemotemotemotemotemotemotemotemotemotemotemot