1、原理分析:首先截取字符串的最后一位用Last表示,再截取剩余字符串用Rest表示,拼接字符串Last + Rest, 此事字符串是不会动的,还需要一个函数setInterval(javascript方法,时间),这个函数是每隔一段时间执行一些动作,执行什么动作,取决于函数中JavaScript的方法,本例中,每隔一段时间就取截取字符,然后拼接起来,因此字符串动起来。
2、简单示例
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head runat="server"> 3 <title>欢迎新同学到来</title> 4 <script type="text/javascript"> 5 function scroll() { 6 var title = document.title; 7 var leftstr = title.charAt(0); 8 var rightstr = title.substring(1, title.length); 9 document.title = rightstr + leftstr; 10 } 11 setInterval("scroll()", 500); 12 </script> 13 </head> 14 <body> 15 </body> 16 </html>
运行结果:
3、复杂的走马灯
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>欢迎新同事到来!</title> 4 <script type="text/javascript"> 5 var leftStr; 6 var rightStr; 7 var getDirection; 8 function strMove(direction) { 9 this.getDirection = direction; 10 var title = document.title; 11 getTitleStr(title); 12 } 13 14 //拼接向左和向右的字符串 15 function getTitleStr(title) { 16 if (getDirection == "left") { 17 leftStr = title.charAt(0); 18 rightStr = title.substring(1, title.length); 19 document.title = rightStr + leftStr; 20 } else { 21 leftStr = title.charAt(title.length - 1); 22 rightStr = title.substring(0, title.length - 1); 23 document.title = leftStr + rightStr; 24 } 25 } 26 27 //停止滚动 28 function stopScoll() { 29 if (getDirection == "left") 30 clearInterval(intervalLeftId); 31 else 32 clearInterval(intervalRightId); 33 } 34 </script> 35 </head> 36 <body> 37 <input type="button" value="向左滚动" onclick="intervalLeftId = setInterval('strMove(\'left\')',500)" /> 38 <input type="button" value="停止滚动" onclick = "stopScoll()" /> 39 <input type="button" value="向右滚动" onclick = "intervalRightId = setInterval('strMove(\'right\')',500)" /> 40 </body> 41 </html>
运行结果: