java相关的一切杂言碎语

2009年3月14日星期六

CSS皮肤切换

最近在做web应用,以前是做GUI开发,所以对CSS,JS不是很熟悉,最近只能恶补。看着现在很多网站都提供了风格的切换功能,确实给人以很好的视觉感受。其实这样的功能实现起来也比较easy。只是在一开始规划web应用之前就应该确定这样的策略,所有的css样式都需要封装到一个(或多个)css文件中,这样后续增加其他css风格切换就算是水到渠成了。
具体的操作步骤大概类似如下:
1. 准备不同的css风格文件
2.使用特定的js实现装载不同的css文件


<script type="text/javascript">

function getCSS(){
datetoday = new Date();
timenow=datetoday.getTime();
datetoday.setTime(timenow);
thehour = datetoday.getHours();
if (thehour<12) display = "morning.css" display = "day.css" display = "night.css" css =" ‘<’;" rel="stylesheet" href="’+display+’">’;
document.write(css);
}

</script>



以上js是根据时间自动切换css风格的,大家可以修改位其他方式,期待大家改造。

1 条评论:

pic