永发信息网

谁帮我解释一下这段javascript代码,

答案:1  悬赏:20  手机版
解决时间 2021-04-23 07:33

<head>

<style type="text/css">

.spanstyle {

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

}

</style>

<script>

var x,y

var step=18

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

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



<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()">




最佳答案

应该是 跟随鼠标的文字特效,,,我帮你注释一下


<head>

<style type="text/css"><!--这是css控制span标签的-->

.spanstyle {

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

}

</style>

<script>

var x,y//定义两个标量 保存鼠标当前位置

var step=18//step是指步长,也是快慢

var flag=0//定义一个变量来判断当前的状态



var message="★南京有线宽带网欢迎你的光临中困历因中顺顺顺要要有在法!"//将文字赋值给message

message=message.split("")//将message打散成数组,,,message现在成数组了,也就是message[0]=★message[1]="南".....类推

var xpos=new Array()//定义xpos变量为一个数组,数组中每个元素保存message数组中对应元素的x坐标

for (i=0;i<=message.length-1;i++) {//一个循环,,初始化xpos数组,即message中 每个文字的出事x坐标为-50

xpos[i]=-50

}



var ypos=new Array()//这个和xpos一样 保存每个文字的y坐标

for (i=0;i<=message.length-1;i++) {

ypos[i]=-200//和上面的循环一样 初始化,每个文字的y坐标为-200

}



function handlerMM(e){//定义一个函数获取鼠标的坐标

x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX//三元运算符。。这里 涉及到浏览器兼容的问题,,你只要知道这是获取鼠标当前的x坐标就行了

y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY//同上获取鼠标的y坐标

flag=1//设置标量flag为1

}



function makesnake() {//定义函数

if (flag==1 && document.all) {//如果flag==1而且是ie浏览器(只有ie支持document.all语句)

for (i=message.length-1; i>=1; i--) {

xpos[i]=xpos[i-1]+step//初始化文字的x坐标,,即,从第二个开始,每个文字距前个文字的距离为step也就是18

ypos[i]=ypos[i-1]//因为每个文字都是平行出现的 所以,,,y坐标全部相等

}

xpos[0]=x+step//设置第一个文字的x坐标为鼠标x坐标

ypos[0]=y//设置第一个文字的y坐标为鼠标的y坐标



for (i=0; i<message.length-1; i++) {//for循环message数组长度那么多次

var thisspan = eval("span"+(i)+".style")//eval语句执行结果为thisspan=spani.style

thisspan.posLeft=xpos[i]//这里是控制span的位置,把数组中对应的值用js来控制span的x坐标位置

thisspan.posTop=ypos[i]//y的

}

}



else if (flag==1 && document.layers) {//如果不是ie浏览器

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)//设置定时器,,过30秒执行一次makesnake() 函数

}



</script>

</head><body bgcolor="#fef4d9" onload="makesnake()">//页面全部加载完毕时候 执行makesnake()函数



<script>

<!-- Beginning of JavaScript -

//下面是输出相应个数的span标签,每个标签保存一个文字

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;//设置鼠标移动事件,也就是鼠标移动,就执行handlerMM函数



// - End of JavaScript - -->

</script>



</body>

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

我要举报
如以上问答信息为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
大家都在看
谁知道这个QQ表情人物的名字
炫舞怎么得时尚套装?
09/10欧冠谁能问鼎冠军?
在秦王嬴政登机时,勾结太后,发动兵变的奸臣
韩国韩华化学株式会社上海代表处怎么去啊,有
吉美干洗衣店地址有知道的么?有点事想过去
包含的意思,什么是包含关系,并列关系,从属关
求架子鼓单机游戏及歌曲谢谢
被空军航空大学录取的机会有多大?体检要几次
火线名字要帅的
宝马Z4GT3什么时候在中国上市.价格又是多少
奔驰s400车,水温表一直在90、而不是80为什么
寻求,“阿了个喵”那个表情的动态,边框 例
100x45X25的红铜有多重?(钢材理论)
这样的QQ标题怎么弄
推荐资讯
魅族手机什么时候能看空间
告白语言一句话,深奥 含蓄的唯美告白句子
怎样在QQ里养花
妻子出轨,法律要.求她净身出户有这一条吗。
关于存车火灾安全标语,防止火灾标语
新会农村商业银行为民分理处地址有知道的么?
AVA里大家希望有女性角色吗?
老家的题比北京的题难吗
爱迪生的名言后一句,有句诗十年一剑勤什么
dnf上怎样锁定装备?
我是一九八二年农历九月初七早上六七点出生的
健康大酒店地址有知道的么?有点事想过去
正方形一边上任一点到这个正方形两条对角线的
阴历怎么看 ?