文本“Hello，World！”在网页的顶部来回移动，每移五步（每步1px），使文本在红色和蓝色之间切换（初始颜色为红色）。



  
  1. <html> 
  2.   <head> 
  3.   <title>动态文档制作</title> 
  4.   <script language="javascript"> 
  5.   i=0; 
  6.   control = true; 
  7.                 count = 0; 
  8.   function moveText() 
  9.   { 
  10.     screenWidth = parseInt(document.body.clientWidth); 
  11.     textWidth     = parseInt(txt.style.width); 
  12.     txt.style.left = i; 
  13.     if(control && screenWidth-textWidth > i) 
  14.     { 
  15.       i+=1; 
  16.       count+=1; 
  17.       if(count==5) 
  18.       change(); 
  19.     } 
  20.     else 
  21.     { 
  22.       control = false; 
  23.     } 
  24.     if(!control && i > 0) 
  25.     { 
  26.       i-=1; 
  27.       count+=1; 
  28.       if(count==5) 
  29.       change(); 
  30.     } 
  31.     else 
  32.     { 
  33.       control = true; 
  34.     } 
  35.     function change() 
  36.     { 
  37.       count=0; 
  38.       var color = document.getElementById("txt").style.color; 
  39.       if(color=="red") 
  40.         document.getElementById("txt").style.color="blue"; 
  41.       else 
  42.         document.getElementById("txt").style.color="red"; 
  43.     } 
  44.     setTimeout("moveText()",100); 
  45.   } 
  46.   </script> 
  47.   </head> 
  48.   <body onLoad="moveText()"> 
  49.     <div id="txt" style="position:absolute;width=98">HelloWord!!</div> 
  50.   </body> 
  51. </html>  

  

效果如下：