Phiên bản đầy đủ: jsB@nk » Con trỏ » Di chuyển theo chuột » Vòng tròn theo con trỏ chuột
URL: https://www.javascriptbank.com/programmable-mouse-trail-script.html
Hiệu ứng sử dụng một tập tin ảnh để tạo hiệu ứng các vòng tròn luôn bám theo sát con trỏ chuột trên website.
Phiên bản đầy đủ: jsB@nk » Con trỏ » Di chuyển theo chuột » Vòng tròn theo con trỏ chuột
URL: https://www.javascriptbank.com/programmable-mouse-trail-script.html
<script language="javascript">var numberimgs=10; // NUMBER OF TOTAL IMAGES TO FOLLOW THE MOUSEvar begW=80; // STARTING WIDTH OF THE IMAGESvar endW=20; // ENDING WIDTH OF THE IMAGESvar begH=20; // STARTING HEIGHT OF THE IMAGESvar endH=80; // ENDING HEIGHT OF THE IMAGESvar imgurl='circle.gif'; // YOUR PICTURE NAME. WILL BE AUTOMATICALLY "SCALED" BASED ON ABOVE SETTINGS.var delay=60; // SPEED OF TRAILvar Xoff=-80; // AMOUNT OF PIXELS TO THE RIGHT IMAGE WILL BE AWAY FROM CURSOR (- VALUES GO TO LEFT)var Yoff=-80; // AMOUNT OF PIXELS TO THE BOTTOM IMAGE WILL BE AWAY FROM CURSOR (- VALUES GO UP)//////////////// NO NEED TO EDIT BEYOND THIS POINT \\\\\\\\\\\\\\\var ns4=(document.layers)?true:false;var ns6=(document.getElementById&&navigator.appName.indexOf("Netscape")>=0)?true:false;var ie4=(document.all&&!document.getElementById)?true:false;var ie5=(document.all&&document.getElementById)?true:false;var stepH=(begH-endH)/numberimgs;var stepW=(begW-endW)/numberimgs;var xcoord=new Array();var ycoord=new Array();for(i=0;i<=numberimgs;i++){ xcoord[i]=0; ycoord[i]=0; }var mImgs=new Array();var t='';for(i=1;i<=numberimgs;i++){t+=(ns4)?'<layer name="img'+i+'" top="0" left="0" width="'+(begW-(i*stepW-stepW))+'" height="'+(begH-(i*stepH-stepH))+'" z-index="'+(numberimgs-i)+'" visibility="show">':'<div id="img'+i+'" style="position:absolute; top:0px; left:0px; width:'+(begW-(i*stepW-stepW))+'px; height:'+(begH-(i*stepH-stepH))+'px;z-index:'+(numberimgs-i)+'; visibility:visible">';t+='<img src="'+imgurl+'" width="'+(begW-(i*stepW-stepW))+'" height="'+(begH-(i*stepH-stepH))+'">';t+=(ns4)?'</layer>':'</div>';}document.write(t);function getmousecoord(evt){xcoord[1]=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX);ycoord[1]=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY);if(!ns6)moveid(mImgs[1], xcoord[1], ycoord[1]);}function moveid(id,x,y){if(ns4)id.moveTo(x,y);else{id.style.left=x;id.style.top=y;}}function moveimgs(){for(i=numberimgs;i>1;i=i-1){xcoord[i]=xcoord[i-1]+stepW/2;ycoord[i]=ycoord[i-1]+stepH/2;}for(i=2;i<=numberimgs;i++)moveid(mImgs[i], xcoord[i], ycoord[i]);}window.onload=function(){ for(i=1;i<=numberimgs;i++)mImgs[i]=(ns4)?document.layers['img'+i]:(ie4)?document.all['img'+i]:document.getElementById('img'+i); if(ns4)document.captureEvents(Event.MOUSEMOVE); document.onmousemove=getmousecoord; if(ns6)setInterval('moveid(mImgs[1],xcoord[1],ycoord[1])',10); setInterval('moveimgs()',delay);}</script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
http://javascriptbank.com/javascript/mouse/circle.gif