一个鼠标跟随的问题,请大虾子们指教!

这个是正确的  <style type="text/css"> 
.s0{ 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#990000; 
font-weight:bold; 
} 
.s1 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#FF3300; 
font-weight:bold; 
} 
.s2 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#FFFF00; 
font-weight:bold; 
} 
.s3 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#006600; 
font-weight:bold; 
} 
.s4 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#66FF00; 
font-weight:bold; 
} 
.s5 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#3300FF; 
font-weight:bold; 
} 
.s6 { 
position:absolute; 
visibility:visible; 
top:-50px; 
font-size:10pt; 
color:#6600FF; 
font-weight:bold; 
} 
</style> <script>
var x,y
var step=40
var flag=0
var message="赤橙黄绿青蓝紫"
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.body.scrollLeft+event.clientX
y =  document.body.scrollTop+event.clientY
flag=1}
function makesnake() {if (flag==1) {
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]=yfor (i=0; i<message.length; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i] } }var timer=setTimeout("makesnake()",30)}
</script>
<body onLoad="makesnake()" >
<script>
for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"'class='s"+i+"'>")
document.write(message[i])
document.write("</span>")}document.onmousemove = handlerMM;
</script> 这个别人的一个例子  我拿过来写成了我觉得好理解的样子的了
和前面的我感觉是一样的  实在找不出哪儿错了
请大虾们指教了!
还有顺便问几个问题
红色的部分   我觉得应该把
xpos[0]=x+step
ypos[0]=y[/color]
放前面   但是这样却出现了第1和2个字平行了    请指教了 为什么放后面了?
还有 鼠标一直往左边拖动(下边也一样)回出现滚动条  
应该怎么避免这个问题了???
以下是原程序:<STYLE TYPE="text/css">
<!--
BODY{
overflow:scroll;
overflow-x:hidden;
}
.s1
{
position : absolute;
font-size : 12pt;
color : blue;
visibility: hidden;
}
.s2
{
position : absolute;
font-size : 20pt;
color : red;
visibility : hidden;
}
.s3
{
position : absolute;
font-size : 16pt;
color : gold;
visibility : hidden;
}
.s4
{
position : absolute;
font-size : 14pt;
color : lime;
visibility : hidden;
}
-->
</STYLE><body bgcolor="#FFFFFF">
<DIV ID="div1" CLASS="s1">*</DIV>
<DIV ID="div2" CLASS="s2">*</DIV>
<DIV ID="div3" CLASS="s3">*</DIV>
<DIV ID="div4" CLASS="s4">*</DIV>
<script language="javascript" type="text/javascript" class="s5">
var nav = (document.layers);
var tmr = null;
var spd = 50;
var x = 0;
var x_offset = 5;
var y = 0;
var y_offset = 15;
if(nav) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = get_mouse; 
function get_mouse(e)
{ 
x = (nav) ? e.pageX : event.clientX+document.body.scrollLeft;
y = (nav) ? e.pageY : event.clientY+document.body.scrollTop;
x += x_offset;
y += y_offset;
beam(1); 
}
function beam(n)
{
if(n<5)
{
if(nav)
{ 
eval("document.div"+n+".top="+y);
eval("document.div"+n+".left="+x);
eval("document.div"+n+".visibility='visible'");
} 
else
{
eval("div"+n+".style.top="+y);
eval("div"+n+".style.left="+x);
eval("div"+n+".style.visibility='visible'");
}
n++;
tmr=setTimeout("beam("+n+")",spd);
}
else
{
clearTimeout(tmr);
fade(4);
} 
} 
function fade(n)
{
if(n>0) 
{
if(nav)eval("document.div"+n+".visibility='hidden'");
else eval("div"+n+".style.visibility='hidden'"); 
n--;
tmr=setTimeout("fade("+n+")",spd);
}
else clearTimeout(tmr);
}
// -->
</script>
</body>  

解决方案 »

  1.   

    LZ的代码我不忍心看了根据原来代码的效果，编写的代码如下：<style type="text/css"> 
    .fontClass{
    width:16px;
    height:16px;
    float:left;
    }
    #divMessage{
    width:112px;
    height:16px;
    position:absolute;
    }
    #a0{
    color : red; 
    }
    #a1{
    color : orange; 
    }
    #a2{
    color : yellow; 
    }
    #a3{
    color : lime; 
    }
    #a4{
    color : #00ffff; 
    }
    #a5{
    color : blue; 
    }
    #a6{
    color : purple; 
    }
    </style> 
    <script language="javascript"> 
    var message = "赤橙黄绿青蓝紫"; 
    message = message.split("");  
    function moveDiv(){ 
    document.getElementById("divMessage").style.left=(event.clientX+document.body.scrollLeft)+"px"; 
    document.getElementById("divMessage").style.top=(event.clientY+document.body.scrollTop)+"px"; 
    for(var i=0;i<message.length;i++){
    document.getElementById("a"+i).style.visibility="visible";
    }
    hideCharacters();//如果不调用该方法就一直显示
    } function hideCharacters(){
    for(var i=0;i<message.length;i++){
    setTimeout("hideElement('a"+i+"')",100*i);
    }
    }function hideElement(theId){
    document.getElementById(theId).style.visibility="hidden";
    }
    </script> 
    <body onmousemove="moveDiv()"> 
    <script>
    for (i=0;i <message.length;i++) { 
    document.write("<div id='divMessage'>");
    document.write(" <span id='a"+i+"' class='fontClass'>") ;
    document.write(message[i]) ;
    document.write(" </span>");
    }
    </script> 
    </body> 
      

  2.   

    ....
    我也是ie6的
    你的代码就没有控制字运动的部分
    第一个是按我的理解写的  是有错误的
    第二个是我改的别人的   是正确的 (第一个和第二个 我感觉是一样的  但是看不出来错)
    第三个才是原代码(嘿嘿  我好象复制错了,我在复制一下,你在看看)
    <style type="text/css">
    .spanstyle {
    position:absolute;
    visibility:visible;
    top:-50px;
    font-size:9pt;
    color: #000000;
    font-weight:bold;
    }</style>
    <script>
    var x,y
    var step=20
    var flag=0
    var message="javascript源码大全。"
    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
    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] } }
    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]} }
    var timer=setTimeout("makesnake()",30)}
    </script>
    <body onLoad="makesnake()" >
    <script>
    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> 
      

  3.   

    我是把所有字放在一个层里，让整个层移动
    移动代码是上面的
    document.getElementById("divMessage").style.left=(event.clientX+document.body.scrollLeft)+"px"; 
        document.getElementById("divMessage").style.top=(event.clientY+document.body.scrollTop)+"px";