警告:以下代码由季雨林本人探索写出,经过ie,firefox,chrome测试
发现chrome(以及360的极速浏览器)浏览器对于javascript的支持明显胜于其他浏览器,请勿在电脑上长时间开启该页面,即使是js引擎强大的chrome也会在运行半小时之后占用满内存,而其他浏览器甚至不能流畅运行,该页面制作初衷是为了仿造一种屏幕保护效果(雨林木风linux系统:九宫格屏保),页面刚启动时的cpu占用达到顶峰时开始正常速度运行(200ms切换颜色)
代码如下(新建文本文件写入以下代码,然后把该文件的后缀名改成“.html”即可):
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>div仿屏幕保护效果 季雨林</title>
<script type="text/javascript" src="divcontrol.js"></script>
<script type="text/javascript">
var colors =new array();
colors[0] = "#222";
colors[1] = "#333";
colors[2] = "#444";
colors[3] = "#555";
colors[4] = "#666";
colors[5] = "#777";
colors[6] = "#888";
colors[7] = "#999";
colors[8] = "#aaa";
colors[9] = "#bbb";
function settimepoint(){
var indexarray = math.floor((math.random()*10));
var indexarray2 = math.floor((math.random()*10));
var idname = "id"+indexarray;
document.getelementbyid(idname).style.backgroundcolor = colors[indexarray2];
//settimeout(settimepoint,100);
setinterval(settimepoint,300);
}
</script>
<style type="text/css">
body{
text-align:center;
background-color:#9cf;
</style>
</head>
<body onload="settimepoint();">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr height="200px">
<td id="id1">&nbsp;</td>
<td id="id2">&nbsp;</td>
<td id="id3">&nbsp;</td>
</tr>
<tr height="200px">
<td id="id4">&nbsp;</td>
<td id="id5">&nbsp;</td>
<td id="id6">&nbsp;</td>
<td id="id7">&nbsp;</td>
<td id="id8">&nbsp;</td>
<td id="id9">&nbsp;</td>
</tr>
</table>
</body>
</html>