网站首页 美食营养 游戏数码 手工爱好 生活家居 健康养生 运动户外 职场理财 情感交际 母婴教育 生活知识 知识问答

Javascript脚本特效示例:[7]字符围绕鼠标

时间:2024-10-24 10:23:38

1、在桌机上新建文本文档,命名为晓博JavaScript特效测试.txt,在文本文档里中入HTML文档的基本元素如下,并保存。<html><head><title>晓博JavaScript特效测试</title></head><body><div id="zy"> <div id="login"></div> <div id="daohang"> <ul> <li><a href="index.html">首页</a></li> <li><a href="jianjie.html">七夕简介</a></li> <li><a href="#">七夕节传说</a></li> <li><a href="#">七夕节习俗</a></li> <li><a href="#">诗词& 歌谣</a></li> <li><a href="#">七夕节寄语</a></li> </ul> </div></div></body></html>

Javascript脚本特效示例:[7]字符围绕鼠标Javascript脚本特效示例:[7]字符围绕鼠标

2、把如下代码加入<head>区域中,并重名文档为HTML文件<SCRIPT language=javascript><!--//var cx=0;var cy=0;var val=0;function locate(){ cx=window.event.x; cy=window.event.y; }document.onmousemove=locate;function follow(i){ var x; if(i<4)x=cx-50+i*10; else x=cx-25+i*10; var y=cy-20+Math.floor(Math.random()*40); w=eval("word"+i); with(w.style) { left=x.toString()+"px"; top=y.toString()+"px"; }}function show(i){ var w=eval("word"+i); with(w.style) { visibility="visible"; s=parseInt(fontSize); if(s>=200)s-=100; else if(s>90&&s<=100) { s-=85; clearInterval(val); if(i<5)val=setInterval("show("+(i+1)+")",20); } fontSize=s; } }function start(){ for(i=1;i<=5;i++) { val=setInterval("show(1)",20); setInterval("follow("+i+")",100); }} //--></SCRIPT><SCRIPT language=javascript> var word=new Array(5); word[1]="w";word[2]="x";word[3]="b";word[4]="j";word[5]="s"; for(i=1;i<=5;i++) document.write("<div id='word"+i+"' style='width:20px;height:20px;position:absolute;font-size:1000;visibility:hidden'><font face='Forte' color='#00FF00'>"+word[i]+"</font></div>");start(); </SCRIPT>

Javascript脚本特效示例:[7]字符围绕鼠标

3、用IE浏览器打开晓博JavaScript特效测试.html文件,可以看到字符围绕鼠标特效,如下图

Javascript脚本特效示例:[7]字符围绕鼠标Javascript脚本特效示例:[7]字符围绕鼠标Javascript脚本特效示例:[7]字符围绕鼠标
© 2026 五度知识库
信息来自网络 所有数据仅供参考
有疑问请联系站长 site.kefu@gmail.com