分时段切换CSS(JavaScriptASPPHP)

赵婉如我爱你

赵婉如我爱你

2016-02-20 00:38

每个人都希望每天都是开心的,不要因为一些琐事扰乱了心情还,闲暇的时间怎么打发,关注图老师可以让你学习更多的好东西,下面为大家推荐分时段切换CSS(JavaScriptASPPHP),赶紧看过来吧!

一个网站能切换不同的CSS风格大家应该都了解,像众所周知的腾讯在今年改版时也增加了切换皮肤的功能。
大家可以先看一下这两个网站:http://www.katgal.com       http://www.leemunroe.com/
上面的这两个网站就是根据时间自动调整站点风格,其实这种根据时间自动调整站点风格也不是什么新鲜事了,记得好久以前也见过类似的文章或方法,只不过当时没有特别注意。

好的,下面说一下它们的实现方法,目前网上有这样两种实现方法
1)   采用服务端的代码
ASP版本:
link rel="stylesheet" type="text/css" href="
%
    if hour(now)12 then
          response.write "morning.css"
    elseif hour(now)17 then
        response.write "day.css"
      else
        response.write "night.css"
      end if
%
"/

PHP版本:
link rel="stylesheet" type="text/css" href="
?php
    $hour = date(H);
    if($hour 12)
        echo 'morning.css';
    else if($hour 17)
        echo 'day.css';
    else
        echo 'night.css';

" /

2)   采用JavaScript代码
script type="text/javascript"
!--
    function getCSS(){
        datetoday = new Date();
        timenow=datetoday.getTime();
        datetoday.setTime(timenow);
        thehour = datetoday.getHours();
        if (thehour12)
            display = "morning.css";
        else if (thehour17)
            display = "day.css";
        else
            display = "night.css";
        //(...想要更多再加即可...)
        
        var css = '';
        css+='link rel="stylesheet" href='+display+' /';
        css+='';
        document.write(css);
    }
--
/script
考虑到客户端可能不支持或者禁止JavaScript,你需要设置一种默认的CSS


http://www.leemunroe.com/站点根据当时的时间自动调整其网站风格的截图







http://www.katgal.com站点根据当时的时间自动调整其网站风格的截图










(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

原文出于:http://www.csslong.cn/article.asp?id=104

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)
展开更多 50%)
分享

猜你喜欢

分时段切换CSS(JavaScriptASPPHP)

Web开发
分时段切换CSS(JavaScriptASPPHP)

分时段眼部护理攻略

电脑网络
分时段眼部护理攻略

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

根据时段自动切换网站的CSS风格

Web开发
根据时段自动切换网站的CSS风格

自动按时段切换网页的CSS风格

Web开发
自动按时段切换网页的CSS风格

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

孕中期胎动频繁 分时段而异

怀孕
孕中期胎动频繁 分时段而异

ASP、PHP与javascript根据时段切换CSS皮肤的代码

Web开发
ASP、PHP与javascript根据时段切换CSS皮肤的代码

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

MAC下怎么从视频中分离出音频文件?

MAC下怎么从视频中分离出音频文件?

JavaScript教程:对象方法的使用

JavaScript教程:对象方法的使用
下拉加载更多内容 ↓