javascript实现动态CSS换肤技术的脚本_javascript技巧

<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();    
          expdate.setTime(expdate.getTime()+(24*60*60*1000*30));    
          //expdate=null;    
                                  //以下设置COOKIES时间为1年,自己随便设置该时间..    
          SetCookie("nowskin",url,expdate,"/",null,false);    
    }    
}    
//-->    
</SCRIPT> 
<P>请选择下面的下拉菜单测试换肤效果</P>   

<a href=# onclick="changecss('css.css')">css.css</a>   
<a href=# onclick="changecss('css1.css')">css1.css</a>   
<a href=# onclick="changecss('css2.css')">css2.css</a>   
<a href=# onclick="changecss('css3.css')">css3.css</a>   
<br>   

<select onchange="changecss(this.value)">   
<option>选择样式单文件</option>   
<script language="javascript">   
var csss=new Array();    
csss[0]="css.css";    
csss[1]="css1.css";    
csss[2]="css2.css";    
csss[3]="css3.css";    
var i;    
for(i=0;i<4;i++)    
    if(thisskin==csss[i])    
          document.write("<option value=\""+csss[i]+"\" selected>"+csss[i]+"样式单文件</option>");    
    else    
          document.write("<option value=\""+csss[i]+"\">"+csss[i]+"样式单文件</option>");    
</script>   
</select>  

时间: 2024-10-23 22:17:52

javascript实现动态CSS换肤技术的脚本_javascript技巧的相关文章

换肤测试程序js脚本_javascript技巧

皮肤设置选项 颜色:

Bootstrap框架结合jQuery仿百度换肤功能实例解析_javascript技巧

换肤功能的应用很广,不管是搜索界面还是普通的管理界面等等,都可以进行设计并且应用换肤功能,起到更好的用户体验.  今天仿造百度的换肤功能,实现了基本的换肤功能,接下来将会为大家介绍如何实现.在设计界面的过程当中,我采用了Bootstrap框架,以便更好的适应屏幕.(当然也是为了更好的熟悉使用这个框架,大家别忘了把Bootstrap框架的css和js包引进来哦).在创建项目时最好可以分别将css.js.images分开.  首先是布局,我只是布局了一下换肤的简单界面,其中就是一些按钮和图片,为了简

JavaScript实现动态删除列表框值的方法_javascript技巧

本文实例讲述了JavaScript实现动态删除列表框值的方法.分享给大家供大家参考.具体如下: 使用JavaScript 动态删除列表框中的值,实际运用中可能效果会比较复杂,这只是一个基本功能单元,很多都是在此基础上扩展而来,运行代码点击"删除",会将列表框中的值一一删除,只保留一项数据. 运行效果截图如下: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "

javascript中使用css需要注意的地方小结_javascript技巧

1.在改变单个元素样式时,注意style对象的语法和css中使用的语法几乎是一一对应的.不过包含连字符的属性则被替换为一种"camel castring"的形式,例如:font-size现在成了fontSize,而margin-top变成了marginTop: 2.在使用"float"时,因为"float"是javascript的一个保留字,所以就不能使用style.float,而改成了style.cssFloat(IE使用的是style.sty

动态CSS,换肤技术

css|动态 常见的例子就是:一个站点上有多个页面样式提供浏览者选择. 同时,在选择了某样式后,再次打开该页面时,将仍然保持该样式. 自然会想到了Cookie技术 下面是HTML代码部分(另外再加需要的CSS文件就可以使用了): <HTML> <HEAD> <link ID="skin" rel="stylesheet" type="text/css"> <TITLE>换肤技术</TITLE&

动态CSS,换肤技术_ASP基础

见的例子就是:一个站点上有多个页面样式提供浏览者选择. 同时,在选择了某样式后,再次打开该页面时,将仍然保持该样式. 自然会想到了Cookie技术  以下是程序代码: <HTML> <HEAD> <link ID="skin" rel="stylesheet" type="text/css"> <TITLE>换肤技术</TITLE> <SCRIPT LANGUAGE=javascr

网页常见的换肤技术

常见的例子就是:一个站点上有多个页面样式提供浏览者选择.  同时,在选择了某样式后,再次打开该页面时,将仍然保持该样式.  自然会想到了Cookie技术  下面是HTML代码部分(另外再加需要的CSS文件就可以使用了):  //        <HTML>  //         //        <HEAD>  //         //        <link ID="skin" rel="stylesheet" type=&q

Android 换肤技术资料整理

Android换肤技术总结 背景 纵观现在各种Android app,其换肤需求可以归为 - 白天/黑夜主题切换(或者别的名字,通常2套),如同花顺/自选股/天天动听等,UI表现为一个switcher. - 多种主题切换,通常为会员特权,如QQ/QQ空间. 对于第一种来说,目测应该是直接通过本地theme来做的,即所有图片/颜色的资源都在apk里面打包了. 而对于第二种,则相对复杂一些,由于作为一种线上服务,可能上架新皮肤,且那么多皮肤包放在apk里面实在太占体积了,所以皮肤资源会在选择后再进行

TheBeerHouse网站项目学习笔记(1)----换肤技术

对于ASP.NET学习的中期,TheBeerHouse 项目是一个不错的选择,这个项目几乎囊括了所有ASP.NET 2.0 下所有的技术点,而且其设计的类图架构知识值得我们借鉴.关于此项目的介绍,在此不罗嗦,可以参看如下 地址: 1. 源码下载: http://www.asp.net/Downloads/starter-kits/the-beer-house 2. 功能技术点介绍: http://www.codeplex.com/TheBeerHouse 3. 该项目真实网站: http://w