根据时间调用不同的CSS文件

iGoogle 和新发布的 Windows Live Wave3 中都有根据时间调用不同CSS样式的动态主题，想不想也将此效果里用到自己 Blog 上，只需一个小小的修改就可以做到啦

示例：

<?php ini_set("date.timezone","Asia/Shanghai"); $hc = date("H");
  if($hc >= 7 && $hc < 18)
  echo '<link rel="stylesheet" type="text/css" href="http://rpsh.net/day.css" media="screen" />';
  else
  echo '<link rel="stylesheet" type="text/css" href="http://rpsh.net/night.css" media="screen" />';
?>

鉴于大多数同学都租用的米国的虚拟主机，所以开始加上一句 ini_set("date.timezone","Asia/Shanghai") 来让时间设定为咱中国时间，剩下的就很好理解了，7点到18点为白天调用 day.css 文件，18点到次日7点为夜间调用 night.css 文件。

具体到我们 WordPress ，你可能就要修改你主题 header.php 文件中的调用CSS 文件的部分：

<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" />

为：

<?php ini_set("date.timezone","Asia/Shanghai"); $hc = date("H");
  if($hc >= 7 && $hc < 18)
  echo '<link rel="stylesheet" type="text/css" href="';  echo bloginfo('stylesheet_directory');   echo '/day.css"';
  else
  echo '/night.css"'  echo 'media="screen" />';
?>

* 你需要编写一个 day.css 和一个 night.css 的文件放在你的主题文件夹里。

如果像本 Blog 一样只是按时间显示不同的 banner 或背景图片，CSS文件的其他地方都相同的话，CSS的调用保持不便，只需在你主题 header.php 文件的 </head> 之前加入下边的代码即可

<style type="text/css">
  body{background: url(<?php ini_set("date.timezone","Asia/Shanghai"); $hc = date("H");
  if($hc >= 6 && $hc < 9)
  echo '图片地址一';
  else if($hc >= 9 && $hc < 18)
  echo '图片地址一';
  else
  echo '图片地址三';
  ?>) no-repeat scroll center top;}
</style>

类似的，你还可以写出早上好，下午好，晚上好之类的欢迎语~~

如果要根据访问用户的系统时间来做判断的话，就有点麻烦了，需要用 js 来返回用户时间，对这个有要求的，可以请教最近玩 js 走火入魔的 Shawn 大师

《根据时间调用不同的CSS文件》上有 35 条评论

这个东东倒是蛮不错的！^_^先收藏下，以后有时间试下^_^

《根据时间调用不同的CSS文件》上有 35 条评论

发表评论 取消回复

发表评论取消回复