14th

11.08

Javascript脚本:setTimeout()方法制作跑马灯

No CommentJavascript脚本cngothic

Javascript脚本:setTimeout()方法制作跑马灯
setTimeout()方法:此方法用于延迟N毫秒后调用X()函数.即setTimeout(x(),1000)
跑马灯特效的思路就是利用setTimeout()方法不断的调用x()函数让其把灯滚动起来.
看下面示例:

  1. <script language="JavaScript">
  2.         <!--
  3.         var today = new Date();
  4.         var year=today.getFullYear()+1;  //得到下一年的年份
  5.         var newYear = new Date(year,1,1);
  6.         var diff = newYear.getTime() - today.getTime();//计算新一年元旦与今天相差的毫秒数
  7.         var days =Math.floor(diff / (1000 * 60 * 60 * 24 ));// 将相差的毫秒数转换为天数
  8.         var str="离"+year+"年元旦还有 " + days + "  天!!!";
  9.         function scroller(){
  10.            str = str.substring(1, str.length) + str.substring(0,1);
  11.            document.title=str;
  12.            window.status=str;
  13.            setTimeout("scroller()", 400);   // 每隔400毫秒调用一次scroller()函数
  14.         }
  15.         scroller();
  16.        //  -->
  17.     </script>

, ,

5th

09.08

Javascript脚本:自动滚屏-setTimeout()-clearTimeout()-scrollBy()

2 CommentsJavascript脚本cngothic

Javascript脚本:自动滚屏效果实例
在阅读文章时.由于文章内容过多.可以使用此方法.可以让网页自动向下滚动来方便阅读.
此篇文章讲到了三个知识点:
setTimeout():在指定的毫秒数后调用函数或计算表达式
clearTimeout():只执行 code 一次.后终止吊.
scrollBy():按照指定的像素值来滚动内容.
看完整JS代码,很简单:

  1. function scrollStar()
  2. {
  3.   if (document.getElementById("checkbox").status == true){
  4.     window.scrollBy(0,1);
  5.     setTimeout("scrollStar()",50);
  6.   }
  7.   else{
  8.     clearTimeout();
  9.   }
  10. }
  11. <input name="" type="checkbox" id="checkbox" value=""  onClick="scrollStar();">

, , , ,