网页背景定时替换可以给访客比较良好的体验，比如白天适合浅颜色的背景，内容更加突出，晚上则适合暗色调的背景，降低对比度不太刺激眼睛。当然这方法也可以用到wordpress模板中，下面给一个用PHP简单实现的例子，先看Demo

（因为没另做Demo，用的是以前的主题，记录了cookie，换回来点这里，页面底部也有）已启用测试站

实现的功能就是，白天8点以后切换成浅色背景，晚上20点以后换成另一背景。并且访客前台可以切换，有一个遮罩的过渡效果，效果从jinwen那里学来的，切换后有cookie记录，刷新不变。

优先级别：首先cookie控制，判读有无访客手动切换的cookie，其次再是时间点判断。

代码部分，

1.、首先需要准备额外两个样式表：（自行定义背景，css就不多说了），假设分别是：light-style.css和dark-style.css。

2、然后首页部分在head输出，通过加入一个函数来控制生成：（一般放function.php里面）

<?php //不要多copy这一行
/*chage theme by time and cookie*/
function WinyskyChangeStyle(){
$url = get_bloginfo('template_url');
$hour = date("H:i:s");
//echo $hour ;//调试确定服务器时间，因为我没用标准时间,相差8个小时
if($_COOKIE['style'] == 'black'){
$home = <<<END
<link rel="stylesheet" type="text/css" href="$url/dark-style.css" title="black" media="screen" /> <link rel="alternate stylesheet" type="text/css" href="$url/light-style.css" title="white" media="screen" /> END;
}elseif($hour > "00:00:00" && $hour < "12:00:00" ||$_COOKIE['style'] == 'white'){
$home = <<<END
<link rel="stylesheet" type="text/css" href="$url/light-style.css" title="white" media="screen" /> <link rel="alternate stylesheet" type="text/css" href="$url/dark-style.css" title="black" media="screen" />
END;
}else{
 $home = <<<END
<link rel="stylesheet" type="text/css" href="$url/dark-style.css" title="black" media="screen" />
<link rel="alternate stylesheet" type="text/css" href="$url/light-style.css" title="white" media="screen" />
END;
}
echo $home;
}

上面用了几个判断，也许不是很全，自己看着修改吧。

这步完成后，需要在header.php里面调用函数输出样式，比如在原来主样式下面：

加入<?php WinyskyChangeStyle(); ?>

3、现在来给前台加个切换的地方，在合适的地方加入：

<div id="styleswitch">
<div id="white"><a title="白天不瞌睡" href="#?style=white" rel="white" class="styleswitch white"></a></div>
<div id="black"><a title="晚上睡的香" href="#?style=black" rel="black" class="styleswitch black"></a></div>
</div>

这是插入手动切换的部分，css就自己发挥啦，我就用了两个图片，太阳和月亮。

4.、用jQuery加上切换效果和保存cookie：分为几个函数：

/* 创建cookie */
function switchStylestyle(styleName)
{setTimeout(function() {
$('link[@rel*=style][title]').each(function(i)
{
this.disabled = true;
if (this.getAttribute('title') == styleName) this.disabled = false;
});}, 500);
createCookie('style', styleName, 365);

}
function createCookie(name,value,days)
{
if (days)
{
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function eraseCookie(name)
{
createCookie(name,"",-1);
} 

$(document).ready(function() {
//切换主题主要函数
$('.styleswitch').click(function() {
$('body').append('<div id="overlay" />');
$('#overlay')
.css({
display: 'none',
position: 'absolute',
top:0,
left: 0,
width: '100%',
height: '2000%',
zIndex: 1000,
background: 'black'
})
.fadeIn(500);
switchStylestyle(this.getAttribute("rel"));
$('#overlay').fadeOut(500);
return false;
});
});

到这里了，呼呼（长文真累），就这样了。

可以看到，上面我替换的是css，意思是不仅是背景，整个布局颜色都可以改变，觉得复杂你也可以直接在php部分就写几个style完事儿。另外，示例的主题不咋的，效果还是有很多，比如首页ajax折叠，头部随机图片。

基本原理就是上面的，做的很粗糙，也很业余，可能有一些方面也没考虑到，高手请无视，当然，能指点下更好了。