»
Tiếng AnhTiếng PhápTiếng Việt

In - Các chú thỏ theo chuột - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Con trỏ » Di chuyển theo chuột » Các chú thỏ theo chuột
URL: https://www.javascriptbank.com/easter-cursor-trailer-easter-cursor-trailer-2.html

Các chú thỏ theo chuột © JavaScriptBank.comHiệu ứng làm cho hình ảnh các chú thỏ di chuyển theo chuột, khi chuột di chuyển thì các chú thỏ dãn ra, khi chuột đứng yên thì các chú thỏ co lại.

Phiên bản đầy đủ: jsB@nk » Con trỏ » Di chuyển theo chuột » Các chú thỏ theo chuột
URL: https://www.javascriptbank.com/easter-cursor-trailer-easter-cursor-trailer-2.html



JavaScript
<script>var step=8 var stepbasic=8var numberofimages=8var spacebetweenimgs=30var x,y,x_oldvar flag=0var pagewidthvar pageheightvar xpos=new Array()var ns6=document.getElementById&&!document.all?1:0for (i=0;i<=8;i++) {xpos[i]=-100}var ypos=new Array()for (i=0;i<=numberofimages;i++) {ypos[i]=-100}function handlerMM(e) {x = (document.layers || ns6) ? e.pageX : document.body.scrollLeft+event.clientXy = (document.layers || ns6) ? e.pageY : document.body.scrollTop+event.clientYflag=1}function initiatetracker() {if (document.all) {pageheight=document.body.clientHeight-30    pagewidth=document.body.clientWidth-30for (i=0; i<numberofimages; i++) {    var thisspan=eval("span"+(i)+".style")thisspan.posLeft=xpos[i]thisspan.posTop=ypos[i]    thisspan.visibility="visible"    }makesnake()}       if (ns6) {   pageheight=window.innerHeight-30    pagewidth=window.innerWidth-30for (i=0; i<numberofimages; i++) {document.getElementById("span"+i).style.left=xpos[i]document.getElementById("span"+i).style.top=ypos[i]    document.getElementById("span"+i).style.visibility="visible"    }makesnake()}if (document.layers) {pageheight=window.innerHeight-30    pagewidth=window.innerWidth-30for (i=0; i<numberofimages; i++) {    var thisspan=eval("document.span"+i)thisspan.left=xpos[i]thisspan.top=ypos[i]thisspan.visibility="visible"}x_old=x    makesnake()}}function makesnake() { if (x_old==x) {spacebetweenimgs--}else {spacebetweenimgs+=5}if (spacebetweenimgs>=30) {spacebetweenimgs=30}if (spacebetweenimgs<=0) {spacebetweenimgs=0}if (flag==1 && document.all) {    for (i=numberofimages; i>=1; i--) {   xpos[i]=xpos[i-1]+spacebetweenimgsypos[i]=ypos[i-1]}xpos[0]=x+stepbasicypos[0]=yfor (i=0; i<numberofimages; i++) {    var thisspan = eval("span"+(i)+".style")if (xpos[i]>pagewidth) {xpos[i]=-2000}thisspan.posLeft=xpos[i]thisspan.posTop=ypos[i]    }}        if (flag==1 && ns6) {    for (i=numberofimages; i>=1; i--) {   xpos[i]=xpos[i-1]+spacebetweenimgsypos[i]=ypos[i-1]    }xpos[0]=x+stepbasicypos[0]=yfor (i=0; i<numberofimages; i++) {if (xpos[i]>pagewidth) {xpos[i]=-2000}    document.getElementById("span"+i).style.left=xpos[i]document.getElementById("span"+i).style.top=ypos[i]    }}else if (flag==1 && document.layers) {    for (i=numberofimages; i>=1; i--) {   xpos[i]=xpos[i-1]+spacebetweenimgsypos[i]=ypos[i-1]    }xpos[0]=x+stepbasicypos[0]=yfor (i=0; i<numberofimages; i++) {if (xpos[i]>pagewidth) {xpos[i]=-2000}    var thisspan = eval("document.span"+i)    thisspan.left=xpos[i]thisspan.top=ypos[i]    }}x_old=xvar timer=setTimeout("makesnake()",30)}if (document.layers){document.captureEvents(Event.MOUSEMOVE);}document.onmousemove=handlerMM;window.onload=initiatetracker</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<div id="span0" style="position:absolute;visibility:hidden;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span1" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span2" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span3" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span4" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span5" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span6" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span7" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><div id="span8" style="position:absolute;visibility:hidden;;overflow:hidden">  <img src="hase.gif" width="24" height="45"></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


Files
http://javascriptbank.com/javascript/mouse/Easter_Cursor_Trailer/hase.gif