最近在看javascript详解这本书看到这个例子
文字滚动,拆分文字来做到文字滚动。
代码如下
<!DOCTYPE html> <html> <head> <meta charset="gb2312" /> <title>专题</title> <style type="text/css"> body{color:#333;font:12px/20px arial; background:#FFF;} body,div,form,img,p,h1,h2,dl,dt,dd,ul,li{padding:0;margin:0;} ul,li{list-style:none;} em{font-style:normal;} img{display:block;border:0} a{color:#333;text-decoration:none} a:hover,td a:hover{color:#f60;text-decoration:underline} </style> <script> var message = "学习javascript将让你的网页更精彩"; message += " 你准备好,学习javascript了吗?"; var space = "..."; var position = 0; function scroller(){ var newtext = message.substring(position,message.length)+space+message.substring(0,position); var con = document.getElementById("tabledata"); con.firstChild.nodeValue = newtext; position++; if(position>message.length){position=0} var timer = window.setTimeout(scroller,200); con.onmouseover = function(){ clearInterval(timer); } con.onmouseout = function(){ timer = window.setTimeout(scroller,200); } } window.onload = function(){ scroller(); } </script> </head> <body> <div id="tabledata">message goes here</div> </body> </html>