首页 > 代码库 > 跟随鼠标飘扬的字符(跨浏览器实现)--鼠标事件
跟随鼠标飘扬的字符(跨浏览器实现)--鼠标事件
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 5 <title>跟随鼠标飘扬的字符</title> 6 <style type="text/css"> 7 .spanstyle { 8 COLOR: red; 9 FONT-FAMILY: 宋体;10 FONT-SIZE: 10pt;11 POSITION: absolute;12 TOP: -50px;13 VISIBILITY: visible14 }15 </style>16 <script>17 var Rx,Ry;18 var step = 18;19 20 // Your snappy message. Important: the space at the end of the sentence!!!21 var message = "★五星红旗迎风飘扬★";22 message = message.split("");23 var xpos = new Array();24 var ypos = new Array();25 26 function handlerMM(e) {27 var evt = e||window.event;28 Rx = evt.clientX||evt.x;29 Ry = evt.clientY||evt.y;30 }31 32 function makesnake() {33 xpos[0] = Rx + step;34 ypos[0] = Ry;35 36 for (i = message.length - 1; i >= 1; i--) {37 xpos[i] = xpos[i - 1] + step;38 ypos[i] = ypos[i - 1];39 }40 41 for (i = 0; i <= message.length - 1; i++) {42 var thisspan = eval("span" + (i) + ".style");43 thisspan.posLeft = xpos[i];44 thisspan.posTop = ypos[i];45 }46 47 var timer = setTimeout("makesnake()", 30);48 }49 </script>50 </head>51 <body bgcolor="#ffffff" onl oad="makesnake()">52 <script>53 for (i = 0; i <= message.length - 1; i++) {54 document.write("<span id=‘span"+i+"‘ class=‘spanstyle‘>");55 document.write(message[i]);56 document.write("</span>");57 }58 document.onmousemove = handlerMM;59 </script>60 </body>61 </html>
跟随鼠标飘扬的字符(跨浏览器实现)--鼠标事件
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。