动态CSS 换肤技术

2016-01-29 11:28 12 1 收藏

动态CSS 换肤技术,动态CSS,换肤技术

【 tulaoshi.com - Javascript 】

常见的例子就是:一个站点上有多个页面样式提供浏览者选择。

同时,在选择了某样式后,再次打开该页面时,将仍然保持该样式。

自然会想到了Cookie技术

下面是HTML代码部分(另外再加需要的CSS文件就可以使用了):

<HTML
<HEAD
<link ID="skin" rel="stylesheet" type="text/css"
<TITLE换肤技术</TITLE
<SCRIPT LANGUAGE=javascript
<!--
function SetCookie(name,value){
     var argv=SetCookie.arguments;
     var argc=SetCookie.arguments.length;
     var expires=(2<argc)?argv[2]:null;
     var path=(3<argc)?argv[3]:null;
     var domain=(4<argc)?argv[4]:null;
     var secure=(5<argc)?argv[5]:false;
     document.cookie=name+"="+escape(value)+((expires==null)?"":("; expires="+expires.toGMTString()))+((path==null)?"":("; path="+path))+((domain==null)?"":("; domain="+domain))+((secure==true)?"; secure":"");
}
function GetCookie(Name) {
     var search = Name + "=";
     var returnvalue = "";
     if (document.cookie.length  0) {
           offset = document.cookie.indexOf(search);
           if (offset != -1) {      
                 offset += search.length;
                 end = document.cookie.indexOf(";", offset);                        
                 if (end == -1)
                       end = document.cookie.length;
                 returnvalue=unescape(document.cookie.substring(offset,end));
           }
     }
     return returnvalue;
}
var thisskin;
thisskin=GetCookie("nowskin");
if(thisskin!="")
     skin.href=thisskin;
else
     skin.href="css.css";
function changecss(url){
     if(url!=""){
           skin.href=url;
           var expdate=new Date(); [next]
           expdate.setTime(expdate.getTime()+(24*60*60*1000*30));
           //expdate=null;
                                   //以下设置COOKIES时间为1年,自己随便设置该时间..
           SetCookie("nowskin",url,expdate,"/",null,false);
     }
}
//--
</SCRIPT
</HEAD
<BODY
<P请选择下面的下拉菜单测试换肤效果</P
<a 

来源:https://www.tulaoshi.com/n/20160129/1482438.html

延伸阅读
标签: Web开发
我们看到创新的方法,使设计者和开发者使用的CSS创新其不足之处。这里,您可以找到一些网站导航使用CSS的最佳方式。你会发现各种各样的技术,真正展示了能力的CSS 。 在这篇文章中,你会找到一个收集优秀的导航技术,使用的CSS为用户提供令人印象深刻的界面。 1. The Menu menu 2. Pure CSS hover menu 3. Matte CSS Menu
标签: PHP
  你可以在php程序中的任何地方使用 echo "hello world!"; 来输出你想输出的内容。 不过你将遇到以下麻烦: 1 - 当你试图在hello和world之间加入两个(或两个以上)空格, 你使用: echo "hello world!"; 你得到的输出还是一个空格,或者你在行首加入一个空格, 你的空格也将被忽略。 2 - 更糟的是输出...
标签: Web开发
引言: 引用一本书中的一段文字:当我第一次开始学习汉语时,我的家庭老师老王给了我一本汉英字典、一本汉语语法书和一本初级教程。但是,他将这些书放 在一个书筐里,并说到下周才能派上用场。在第一周,他只教我听和记一些短语。在开始严格有序的学习前,他要我学会如何复述一些短评。请问,哪里有餐 馆?。请给我来点米饭。这件衣服多少钱?...
标签: Web开发
关于CSS Sprites技术的优化我们能做到多少,能减多少的请求数量。这并且不是单方面能做到的,一切取决于XHTML、CSS、CSS Sprites图片之间的配合。现时为止没有绝对优化的做法,这也是我在项目中经常衡量CSS Sprites图片与XHTML关系,如:《一张背景实现自适应九宫格》,以下总结了图片切割术与图象优化的一些方法。 图片优化 对于...
标签: Web开发
CSS是Cascading Style Sheets(层叠样式表单)的简称。更多的人把它称作样式表。顾名思义,它是一种设计网页样式的工具。借助CSS的强大功能,网页将在您丰富的想象力下千变万化,越来越多的人在学习而很多初学者没有一个头绪,整理了一些学习的方法给大家。 一. CSS学习重在方法! 学习任何东西都是一样,从小学、中学、大学,除了学习知识外...

经验教程

913

收藏

80

精华推荐

动态加载外部CSS与JS文件

动态加载外部CSS与JS文件

lelin343189

动态调用css文件——jquery的应用

动态调用css文件——jquery的应用

_Q757856333惨

动态加载外部css或js文件

动态加载外部css或js文件

XFM15934954000

微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部