当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript 小技巧(第六集)

Javascript
javascript实例教程(19) 使用HoTMetal(5)
javascript实例教程(19) 使用HoTMetal(6)
javascript实例教程(19) 使用HoTMetal(7)
javascript实例教程(20) OLE Automation(1)
javascript实例教程(20) OLE Automation(2)
javascript实例教程(20) OLE Automation(3)
javascript实例教程(20) OLE Automation(4)
javascript实例教程(20) OLE Automation(5)
javascript实例教程(20) OLE Automation(6)
javascript实例教程(20) OLE Automation(7)
用javascript实现利用FLASH嵌入声音
javascript版的日期输入控件(6)
javascript设计网页中的下拉菜单
javascript设计漫天雪花
javascript制作浮动的工具条
javascript制作闪烁的边框
javascript模拟游戏中的弹出菜单效果
在IE中使用javascript
利用javascript制作简单动画
首页地址添加到收藏夹(javascript)

Javascript 中的 JavaScript 小技巧(第六集)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-10   浏览: 166 ::
收藏到网摘: n/a

以下是我们所制作的跑马灯效果的源程序

 <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);
 }
 //-->
 </script>
 <body onLoad="scroll();return true;">
 Here goes your cool page!
 </body>
 </html>
  此一程式中我们使用了和上面同样的函数(或部分)setTimeout(...)通知,计时器在时间到时去呼叫 scroll()函数,使得跑马灯中的文字往前进一格。 在函数的一开始,有一些较罗嗦的计算部分,但这并不难使我们了解,这些计算主要是用来取得跑马灯中的文字应该由那一个位置开始显示的用途。一开始当然是必需加一些空白在字的左边,让文字部分能尽可能靠右,然后再一字字的将空白减少,结果自然就造成字往前移动的效果了。