有趣的javascript程序:抓不到我!,JavaScript,脚本特效

来源:互联网 发布:学生管理系统数据库 编辑:程序博客网 时间:2024/04/29 11:41
你只消把这段程序代码剪贴到你自己页面的<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;height:200;top:0;left:0;">
<a href="#" onmouseover="swtrun('unique_id')" onmouseout="swtdiv=null">
<img src="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.height:document.body.clientheight;
if (swtdiv) {
if (document.layers) swtdiv.style=swtdiv;
divw=swtdiv.clip?swtdiv.clip.width:parseint(swtdiv.style.width);
divh=swtdiv.clip?swtdiv.clip.height:parseint(swtdiv.style.height);
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[i].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;height:200;top:0;left:0;">
<a href="#" onmouseover="swtrun('unique_id')" onmouseout="swtdiv=null">
<img src="img.gif" width=100 height=200 border=0></a>
</div></layer><ilayer name="swtloc" width=100 height=200></ilayer>

把上面出现的三个unique_id替换成某个你自己取的唯一的名字(不过可别用swtloc这个名字,它在这个程序里面是个保留字),然后把四组宽度与高度作适当的调整。你可以用上面的原始码在同一个页面里头放入多张不同的图片。感谢这段程序!这些图片全都会立刻变得超级害羞,看到鼠标光标靠近就立刻躲到旁边去。而且就像 java 版本那样,还真有些白痴家伙会乐此不疲地连续几个钟头追着这些图片跑哩! <
原创粉丝点击