天天看點

仿linux系統九宮格屏保程式:js網頁版

警告:以下代碼由季雨林本人探索寫出,經過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"> </td>

    <td id="id2"> </td>

    <td id="id3"> </td>

  </tr>

  <tr height="200px">

    <td id="id4"> </td>

    <td id="id5"> </td>

    <td id="id6"> </td>

    <td id="id7"> </td>

    <td id="id8"> </td>

    <td id="id9"> </td>

  </tr>  

</table>

</body>

</html>