在网页上实现图标的漂浮移动效果

<div id=float_icon style="VISIBILITY: hidden; POSITION: absolute; LEFT=0;TOP=0">
 <a href="http://pageantry.cnblogs.com" target="_blank"><img src="D:\1\1.JPG"></a>
</div>
<script language="javascript">
 var dirX=1,dirY = 1;
 var xPos = 0,yPos = 0;
 //为开阔读者的知识面，下面使用了多种形式来引用float_icon对象
 float_icon.style.top = 0; 
 document.body.all.float_icon.style.left = 0;
 document.body.all("float_icon").style.visibility = "visible";
 window.setInterval("moveIcon()",100);
 function moveIcon()
 {
  //每次移动2个像素
  xPos += 2*dirX;
  yPos += 2*dirY;
  float_icon.style.top = yPos + document.body.scrollTop;
  float_icon.style.left = xPos + document.body.scrollLeft;
  /*下面代码实现当图标碰到到窗口边界时，改变图标移动的方向。如果图标左边位置加上图标宽度的结果大于窗体客户区宽度，就表示图标已碰到窗口右边界*/
  if(xPos<=0 || xPos+float_icon.offsetWidth>=document.body.clientWidth)
   dirX = -dirX;
  if(yPos<=0 || yPos+float_icon.offsetHeight>=document.body.clientHeight)
   dirY = -dirY;
 } 
</script>