今天天气好晴朗处处好风光，好天气好开始，图老师又来和大家分享啦。下面给大家推荐js基础:JavaScript小技巧制作的跑马灯效果，希望大家看完后也有个好心情，快快行动吧！
【 tulaoshi.com - Web开发 】
以下是我们所制作的跑马灯效果的源程序
＜html
＜head
＜script language="JavaScript"
＜!-- Hide
var scrtxt="这儿的讯息可以改为你要告诉别人的话 "+"
或是注意事项 ...";
var lentxt=scrtxt.length;
var width=100;
var pos=1-width;
function scroll() {
pos++;
var scroller="";
if (pos==lentxt) {
pos=1-width;
}
if (pos＜0) {
for (var i=1; i＜=Math.abs(pos); i++) {
scroller=scroller+" ";}
scroller=scroller+scrtxt.substring(0,width-i+1);
}
else {
scroller=scroller+scrtxt.substring(pos,width+pos);
}
window.status = scroller;
setTimeout("scroll()",150);
}
file://--
＜/script
＜body onLoad="scroll();return true;"
Here goes your cool page!
＜/body
＜/html
此一程式中我们使用了和上面同样的函数（或部分）setTimeout(...)通知，计时器在时间到时去呼叫 scroll()函数，使得跑马灯中的文字往前进一格。 在函数的一开始，有一些较罗嗦的计算部分，但这并不难使我们了解，这些计算主要是用来取得跑马灯中的文字应该由那一个位置开始显示的用途。一开始当然是必需加一些空白在字的左边，让文字部分能尽可能靠右，然后再一字字的将空白减少，结果自然就造成字往前移动的效果了。
（本文来源于图老师网站，更多请访问https://www.tulaoshi.com/webkaifa/）来源:https://www.tulaoshi.com/n/20160219/1611576.html
看过《js基础:JavaScript小技巧制作的跑马灯效果》的人还看了以下文章 更多>>
