程序清單：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>隨鼠標的彩色字符</title>
</head>
<body scroll="no" bgcolor="#ffffff" onload=javascript:pageonload()>
<STYLE>
<!--
.spanstyle {
COLOR: #0066ff; FONT-SIZE: 14pt; FONT-WEIGHT: normal; POSITION: absolute; TOP: -50px; VISIBILITY: visible}
-->
</STYLE>
<SCRIPT language=javascript>
<!--
var message="a b c d e f g h i j k l m n o p q r s t u v w x y z .........."; //注解：鼠標后跟隨的文字內容
var x,y; //注解：定義變量
var step=12;
var flag=0;
message=message.split("");
var xpos=new Array();
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50;}
var ypos=new Array();
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50;}
function handlerMM(e) {
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX+10;
//注解：在鼠標左側10個單位的地方進行卷軸運動
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY;
flag=1;}
function makesnake() {
if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step;
ypos[i]=ypos[i-1];}
xpos[0]=x+step;
ypos[0]=y;
for (i=0; i<=message.length-1; i++) {
var thisspan = eval("span"+(i)+".style");
thisspan.posLeft=xpos[i];
thisspan.posTop=ypos[i];
thisspan.color=Math.random() * 255 * 255 * 255 + Math.random() * 255 * 255 + Math.random() * 255;
//注解：定義隨機顏色
}}
else if (flag==1 && document.layers) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step;
ypos[i]=ypos[i-1];}
xpos[0]=x+step;
ypos[0]=y;
for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i);
thisspan.left=xpos[i];
thisspan.top=ypos[i];
thisspan.color=Math.random() * 255 * 255 * 255 + Math.random() * 255 * 255 + Math.random() * 255;
}}}
//-->
</SCRIPT>
<SCRIPT language=javascript>
<!--
for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"' class='spanstyle'>");
document.write(message[i]);
document.write("</span>");}
if (document.layers) {
document.captureEvents(Event.MOUSEMOVE)}
document.onmousemove = handlerMM;
//-->
</SCRIPT>
<SCRIPT language=javascript>
<!--
function pageonload() {
makesnake();
window.setTimeout("pageonload();", 2);
}
//-->
</SCRIPT>
</body>
</html>
posted on 2009-08-12 09:40
毒毒 閱讀(1127)
評論(0) 編輯 收藏 所屬分類:
javascript