📄 mousetracking.htm

📁 JavaScript特效（新）这里有许多的JAVA特效.供学者参考
💻 HTM
字号:
<html>
<head>
<title>mouse tracking</title>
</head>

<body bgcolor="#FFFFFF">
<div id="mtid1" style="position: absolute;z-index: 100; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="30" height="30" alt=""> </dd>
</div>
<div id="mtid2"
style="position: absolute;z-index: 90; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="25" height="25" alt=""> </dd>
</div>
<div id="mtid3"
style="position: absolute;z-index: 80; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="20" height="20" alt=""> </dd>
</div>
<div id="mtid4" style="position: absolute;z-index: 70; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="15" height="15" alt=""> </dd>
</div>
<div id="mtid5"
style="position: absolute;z-index: 60; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="10" height="10" alt=""> </dd>
</div>
</body>
<script>
var isNS = (navigator.appName == "Netscape");
layerRef = (isNS) ? "document" : "document.all";
styleRef = (isNS) ? "" : ".style";
var queue = new Array();
var NUM_OF_TRAIL_PARTS = 5
for (x=1; x < 6; x++) {
eval("mtidFrame" + x + " = new Image(36,36);");
eval("mtidFrame" + x + ".src = 'mt" + x + ".gif';"); 
}
function mtidObj(anID) {
this.mtidID = "mtid" + anID;
this.imgRef = "mtid" + anID + "img";
this.currentFrame = 1;
this.animatemtid = animatemtid;
}
function animatemtid() {
if (this.currentFrame <6 ) {
if (isNS) {
eval("document." + this.mtidID +".document['"+this.imgRef+"'].src = mtidFrame" + this.currentFrame + ".src");
} else {

}
this.currentFrame ++;
} else {
eval(layerRef + '.' + this.mtidID + styleRef + '.visibility = "hidden"');
}
}
function processAnim() {
for(x=0; x < NUM_OF_TRAIL_PARTS; x++)
queue[x].animatemtid();
}
function processMouse(e) {
currentObj = shuffleQueue();
if (isNS) {
eval("document." + currentObj + ".left = e.pageX - 10 ;");
eval("document." + currentObj + ".top = e.pageY + 10;");
} else {
eval("document.all." + currentObj + ".style.pixelLeft = event.clientX + document.body.scrollLeft - 10 ;");
eval("document.all." + currentObj + ".style.pixelTop = event.clientY + document.body.scrollTop + 10;");
}
}
function shuffleQueue() {
lastItemPos = queue.length - 1;
lastItem = queue[lastItemPos];
for (i = lastItemPos; i>0; i--) 
queue[i] = queue[i-1];
queue[0] = lastItem;
queue[0].currentFrame = 1;
eval(layerRef + '.' + queue[0].mtidID + styleRef + '.visibility = "visible"'); 
return queue[0].mtidID;
}
function init() {
for(x=0; x<NUM_OF_TRAIL_PARTS; x++)
queue[x] = new mtidObj(x+1) ;
if (isNS) { document.captureEvents(Event.MOUSEMOVE); }
document.onmousemove = processMouse;
setInterval("processAnim();",25);
} 
window.onload = init;
</script>
<BR>CODE:<BR>

<xmp>
<html>
<head>
<title>mouse tracking</title>
</head>

<body bgcolor="#FFFFFF">
<div id="mtid1" style="position: absolute;z-index: 100; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="30" height="30" alt=""> </dd>
</div>
<div id="mtid2"
style="position: absolute;z-index: 90; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="25" height="25" alt=""> </dd>
</div>
<div id="mtid3"
style="position: absolute;z-index: 80; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="20" height="20" alt=""> </dd>
</div>
<div id="mtid4" style="position: absolute;z-index: 70; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="15" height="15" alt=""> </dd>
</div>
<div id="mtid5"
style="position: absolute;z-index: 60; left: 600px; top: 5px; visibility: hidden">
<dd><img src="mt.gif" width="10" height="10" alt=""> </dd>
</div>
</body>
<script>
var isNS = (navigator.appName == "Netscape");
layerRef = (isNS) ? "document" : "document.all";
styleRef = (isNS) ? "" : ".style";
var queue = new Array();
var NUM_OF_TRAIL_PARTS = 5
for (x=1; x < 6; x++) {
eval("mtidFrame" + x + " = new Image(36,36);");
eval("mtidFrame" + x + ".src = 'mt" + x + ".gif';"); 
}
function mtidObj(anID) {
this.mtidID = "mtid" + anID;
this.imgRef = "mtid" + anID + "img";
this.currentFrame = 1;
this.animatemtid = animatemtid;
}
function animatemtid() {
if (this.currentFrame <6 ) {
if (isNS) {
eval("document." + this.mtidID +".document['"+this.imgRef+"'].src = mtidFrame" + this.currentFrame + ".src");
} else {

}
this.currentFrame ++;
} else {
eval(layerRef + '.' + this.mtidID + styleRef + '.visibility = "hidden"');
}
}
function processAnim() {
for(x=0; x < NUM_OF_TRAIL_PARTS; x++)
queue[x].animatemtid();
}
function processMouse(e) {
currentObj = shuffleQueue();
if (isNS) {
eval("document." + currentObj + ".left = e.pageX - 10 ;");
eval("document." + currentObj + ".top = e.pageY + 10;");
} else {
eval("document.all." + currentObj + ".style.pixelLeft = event.clientX + document.body.scrollLeft - 10 ;");
eval("document.all." + currentObj + ".style.pixelTop = event.clientY + document.body.scrollTop + 10;");
}
}
function shuffleQueue() {
lastItemPos = queue.length - 1;
lastItem = queue[lastItemPos];
for (i = lastItemPos; i>0; i--) 
queue[i] = queue[i-1];
queue[0] = lastItem;
queue[0].currentFrame = 1;
eval(layerRef + '.' + queue[0].mtidID + styleRef + '.visibility = "visible"'); 
return queue[0].mtidID;
}
function init() {
for(x=0; x<NUM_OF_TRAIL_PARTS; x++)
queue[x] = new mtidObj(x+1) ;
if (isNS) { document.captureEvents(Event.MOUSEMOVE); }
document.onmousemove = processMouse;
setInterval("processAnim();",25);
} 
window.onload = init;
</script>

</html>
</xmp>
</html>
<html><script language="JavaScript">                                                                  </script></html>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -