永发信息网

javascript文字随鼠标动的问题

答案:2  悬赏:20  手机版
解决时间 2021-07-19 07:51
  • 提问者网友:疯子也有疯子的情调
  • 2021-07-18 22:14

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>文字跟随鼠标动</title>
<style>
.spanstyle
{
position:absolute;
visibility:visible;
top:-50px;
font-size:13pt;
font-family:Verdana;
font-weight:bold;
color:black;
}
</style>
<script language="javascript">
var x,y
var step=30
var flag=0
var message="我是飘动的文字用JAVASCRIPT实现的"
message=message.split("")
var xpos=new Array( ) <!--这句是什么意啊?把XPOS定义为数组吗?-->
for (i=0;i<=message.length-1;i++)
{ <!--这是把数组中的每个元素定义为-50吗?-->
xpos[i]=-50 <!--这个-50是坐标吗,坐标不是应该由鼠标赋予的吗,这里是不是随便写个数就好了,只要是同类型的就行,还是这个-50有什么特定的意义啊?-->
}
var ypos=new Array( )
for (i=0;i<=message.length-1;i++)
{
ypos[i]=-50
}
function handlerMM(e) <!--这个e是什么类型的啊还有下面的2条语句应该是获取鼠标的坐标用的吧,希望大家能仔细讲解下啊,-->
{
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+sgep
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 ti=setTimeout("makesnake()",30)
}
</script>
</head>

<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll">
<script language="javascript">
<!-- Beginning of 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.captureEverts(Event.ONMOUSEMOVE);
}
document.onmousemove=handlerMM;
//-end of JavaScript- -->
</script>

</body>

</html><!--而且这个代码好象获取Y方向的坐标,又该怎么改啊,谢谢-->

最佳答案
  • 五星知识达人网友:不甚了了
  • 2021-07-18 23:38


<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll">
老大style="width:100%;overflow-x:hidden;overflow-y:scroll


x坐标隐藏 y坐标显示 去掉这句就行了


脚本说明:


第一步:把如下代码加入<head>区域中


<style type="text/css">


.spanstyle {


COLOR: #ffd8ff; FONT-FAMILY: 宋体; FONT-SIZE: 10pt; POSITION: absolute; TOP: -50px; VISIBILITY: visible


}


</style>


<script>


var x,y


var step=18


var flag=0


// Your snappy message. Important: the space at the end of the sentence!!!


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]=-200


}



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>区域中


<script>


<!-- Beginning of 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;



// - End of JavaScript - -->


</script>



第三步:把<body>改为


<body bgcolor="#fef4d9" onload="makesnake()">



全部回答
  • 1楼网友:詩光轨車
  • 2021-07-19 00:04

var xpos=new Array( ) <!--这句是什么意啊?把XPOS定义为数组吗?-->

定为数组

====================================================================== for (i=0;i<=message.length-1;i++) { <!--这是把数组中的每个元素定义为-50吗?--> xpos[i]=-50 <!--这个-50是坐标吗,坐标不是应该由鼠标赋予的吗,这里是不是随便写个数就好了,只要是同类型的就行,还是这个-50有什么特定的意义啊?--> }

用循环的,把刚才那个数组赋值,把每个数都赋为-50

-50下面的作用是文字出现时的Y坐标

======================================================================

function handlerMM(e) <!--这个e是什么类型的啊还有下面的2条语句应该是获取鼠标的坐标用的吧,希望大家能仔细讲解下啊,-->

E就是触发事件的对象,你可以理角成整个浏览器

====================================================================== { if(flag==1&&document.all) <!--这个语句什么意识啊?-->

如果是IE ======================================================================

var thisspan=eval("span"+(i)+".style") <!--这个也不懂啊-->

循环出每个文字所在的标签内的样式 thisspan.posLeft=xpos[i] <!--详解--> 把这些文字所在的标签设定它的左定位,也就是坐标

====================================================================== } if(document.layers) <!--头都大了--> 和上面的if(document.all)作用一样,可理角成判断是不是IE,或浏览器有没有效

虽然告诉你这些的意思,但深入理理它也没什么用,拿来用就好了。

我要举报
如以上回答内容为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
点此我要举报以上问答信息
大家都在看
推荐资讯