有趣的javascript程序:抓不到我
时间:2007-02-17 来源:PHP爱好者
你只消把这段程序代码剪贴到你自己页面的<head>区段里面:
  <script language="JavaScript">
  <!--
  /* Elusive image script by Paul Anderson, copyright 2001 CNET Builder.com.
  May be freely used with attribution. Not for resale.
  你可以用以下的原始碼在同一個頁面裡頭放入多張不同的圖片。將這裡的三個 unique_id 替換成
  某個你自己取的唯一的名字(不過可別用 swtLoc 這個名字,它在這個程式裡面是個保留字),
  然後把四組寬度與高度作適當的調整。
  <layer name="unique_id" width=100 height=200>
  <div id="unique_id" style="position:relative;width:100;top:0;left:0;">
  <a href="#" onmouseOver="swtRun('unique_id')" onmouseout="swtDiv=null">
  <img src=http://www.ddvip.net/web/js/index2/"img.gif" width=100 height=200 border=0></a>
  </div></layer><ilayer name="swtLoc" width=100 height=200></ilayer>
*/
var oldX=0,oldY=0,newX,newY,xDir,yDir,swtDiv
  function swtFlee(arg) {
  ev=arg?arg:event;
  newX=ev.pageX?(isNaN(ev.pageX)?0:ev.pageX):ev.clientX;
  newY=ev.pageY?(isNaN(ev.pageY)?0:ev.pageY):ev.clientY;
  xDir=5*(newX-oldX);
  yDir=5*(newY-oldY);
  oldX=newX;
  oldY=newY;
  maxW=document.width?document.width:document.body.clientWidth;
  maxH=document.height?document.
  if (swtDiv) {
  if (document.layers) swtDiv.style=swtDiv;
  divW=swtDiv.clip?swtDiv.clip.width:parseInt(swtDiv.style.width);
  divH=swtDiv.clip?swtDiv.clip.
  swtDiv.style.left=parseInt(swtDiv.style.left)+xDir;
  swtDiv.style.top=parseInt(swtDiv.style.top)+yDir;
  if (newX <= divW) swtDiv.style.left=parseInt(swtDiv.style.left)+divW;
  if (newX >= maxW-divW) swtDiv.style.left=parseInt(swtDiv.style.left)-divW;
  if (newY <= divH) swtDiv.style.top=parseInt(swtDiv.style.top)+divH;
  if (newY >= maxH-divH) swtDiv.style.top=parseInt(swtDiv.style.top)-divH;
  }
  }
  function swtRun(divID) {
  swtDiv=document.getElementById?document.getElementById(divID):document.all?document.all[divID]:document.layers?document.layers[divID]:null;
  }
  function initFlee() {
  if (document.layers) {
  document.captureEvents(Event.MOUSEMOVE);
  for (i=0;i<document.layers.length-1;i++) {
  if (document.layers[i+1].name.substr(0,6)=="swtLoc") {
  document.layers.moveTo(document.layers[i+1].pageX,document.layers[i+1].pageY);
  }
  }
  }
  document.onmousemove=swtFlee;
  }
  window.onload=initFlee;
  //-->
  </script>
然后把你想要拿来跟客人玩躲猫猫的图片用下面这段 HTML 打点一下就成了:
  <layer name="unique_id" width=100 height=200>
  <div id="unique_id" style="position:relative;width:100;top:0;left:0;">
  <a href="#" onmouseOver="swtRun('unique_id')" onmouseout="swtDiv=null">
  <img src=http://www.ddvip.net/web/js/index2/"img.gif" width=100 height=200 border=0></a>
  </div></layer><ilayer name="swtLoc" width=100 height=200></ilayer>
把上面出现的三个unique_id替换成某个你自己取的唯一的名字(不过可别用swtLoc这个名字,它在这个程序里面是个保留字),然后把四组宽度与高度作适当的调整。你可以用上面的原始码在同一个页面里头放入多张不同的图片。感谢这段程序!这些图片全都会立刻变得超级害羞,看到鼠标光标靠近就立刻躲到旁边去。而且就像 Java 版本那样,还真有些白痴家伙会乐此不疲地连续几个钟头追着这些图片跑哩!
php爱好者站 http://www.phpfans.net 文章|教程|下载|源码|论坛.










