根据时间来自动切换网页背景颜色或图片背景教程

前言

有些时侯为了丰富页面的显示效果,将页面制作成根据时间变换页面背景的样式,这样会使浏览者对此网站不会感觉厌倦,同时也会觉得网站制作的非常新颖。

本文通过 Date 对象的 getHours() 方法获得当前时间,然后根据不同的时间段来改变页面的背景颜色,当然也可以实现更改背景图片等操作,大家也可自行研究。

方法

直接将下面的代码放在页脚文件 foot 或者 footer 里面

上面代码中 time > 6 && time < 18 为时间,指的是早上6点到晚上6点之间,可以自行修改时间。

 

上面#fff222和#000为颜色代码,可以自行改修颜色。

 

如果想换成图片的话就把上面的

document.body.style.backgroundColor="#fff222";
document.body.style.backgroundColor="#000";

替换成下面这段代码

 

© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享
评论 共5条
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片快捷回复
    • 的头像-知新网曙光0
    • 的头像-知新网ningyungame0
    • 的头像-知新网gdshgdhashg0
    • 的头像-知新网钻石会员柚子星0
社区求救信号帮助是一种美德