四种JS滚动代码

 1 <div id="marquees">
 2   <a href="#">你可曾有过无数的梦想</a><br><br>
 3    <a href="#">却在时光的流逝里幻灭</a><br><br>
 4    <a href="#">你可曾对未来期待憧憬</a><br><br>
 5    <a href="#">却在成长的岁月中迷失</a><br><br>
 6  </div> 
 7 <script language="JavaScript">
 8 marqueesHeight=200;
 9 stopscroll=false;
10 with(marquees){
11   style.width=0;
12   style.height=marqueesHeight;
13   style.overflowX="visible";
14   style.overflowY="hidden";
15   noWrap=true;
16   onmouseover=new Function("stopscroll=true");
17   onmouseout=new Function("stopscroll=false");
18 }
19 document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');
20 
21 preTop=0; currentTop=0; 
22 
23 function init(){
24   templayer.innerHTML="";
25   while(templayer.offsetHeight<marqueesHeight){
26     templayer.innerHTML+=marquees.innerHTML;
27   }
28   marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
29   setInterval("scrollUp()",50);
30 }
31 document.body.onload=init;
32 
33 function scrollUp(){
34   if(stopscroll==true) return;
35   preTop=marquees.scrollTop;
36   marquees.scrollTop+=1;
37   if(preTop==marquees.scrollTop){
38     marquees.scrollTop=templayer.offsetHeight-marqueesHeight;
39     marquees.scrollTop+=1;
40   }
41 }
42 </script>

 1 <base href="<a href="http://www.flash8.net" target="_blank">http://www.flash8.net</a>">
 2  <div id=demo style=overflow:hidden;height:100;width:90;background:#214984;color:#ffffff>
 3  <div id=demo1>
 4  <img src="/images/flash8.gif">
 5  <img src="/images/link/flashempire.gif">
 6  <img src="/images/linklogo/shlogo.gif">
 7  <img src="/images/link/deskcity.gif">
 8  <img src="/images/linklogo/5dmeng.gif">
 9  <img src="<a href="http://www.blueidea.com/logo.gif" target="_blank">http://www.blueidea.com/logo.gif</a>">
10  <img src="/images/link/flashskylogo.gif">
11  <img src="/images/link/5dlogo88.gif">
12  <img src="<a href="http://www.yiiboo.com/cgercn/link.gif" target="_blank">http://www.yiiboo.com/cgercn/link.gif</a>">
13  </div>
14  <div id=demo2></div>
15  </div>
16    
17 
18 
19 <script>
20    var speed=30
21    demo2.innerHTML=demo1.innerHTML
22    function Marquee(){
23    if(demo2.offsetTop-demo.scrollTop<=0)
24    demo.scrollTop-=demo1.offsetHeight
25    else{
26    demo.scrollTop++
27    }
28    }
29    var MyMar=setInterval(Marquee,speed)
30    demo.onmouseover=function() {clearInterval(MyMar)}
31    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
32    </script>

 1 <body>   
 2   <div   style="width:200px;height:100px;overflow:hidden">   
 3   <div   id="scroll"   style="position:relative;top:0px">   
 4   <table   border="1">   
 5   <tr><td>111</td><td>222</td><td>333</td></tr>   
 6   <tr><td>111</td><td>222</td><td>333</td></tr>   
 7   <tr><td>111</td><td>222</td><td>333</td></tr>   
 8   <tr><td>111</td><td>222</td><td>333</td></tr>   
 9   <tr><td>111</td><td>222</td><td>333</td></tr>   
10   <tr><td>111</td><td>222</td><td>333</td></tr>   
11   <tr><td>111</td><td>222</td><td>333</td></tr>   
12   <tr><td>111</td><td>222</td><td>333</td></tr>   
13   <tr><td>111</td><td>222</td><td>333</td></tr>   
14   <tr><td>111</td><td>222</td><td>333</td></tr>   
15   <tr><td>111</td><td>222</td><td>333</td></tr>   
16   </table>   
17   </div>   
18   </div>   
19   <script   type="text/javascript">   
20   var   obj=document.getElementById("scroll");   
21   var   scrollUnit=1;   //滚动高度   
22   var   interval=100;   //时间间隔   
23   setTimeout(scroll,interval);   
24   function   scroll()   
25   {   
26   obj.style.pixelTop-=scrollUnit;   
27   setTimeout(scroll,interval);   
28   }   
29   </script>   
30   </body>

4.js滚屏代码,隔一段时间向上滚动

 1 
 2 <html>
 3 <head>
 4 <meta http-equiv="content-type" content="text/html;charset=utf-8" />
 5 <style type="text/css">
 6 #icefable1 {
 7  MARGIN-TOP: 2px; BACKGROUND: #494c6e; COLOR: #ffff00; LINE-HEIGHT: 26px; HEIGHT: 26px; TEXT-DECORATION: none
 8 }
 9 #icefable1 DIV {
10  PADDING-LEFT: 30px; BACKGROUND: url(../images/index/point_style_00.gif) no-repeat 12px 4px; WIDTH: 350px
11 }
12 #icefable1 A:hover {
13  COLOR: #656a82; LINE-HEIGHT: 26px
14 }
15 </style>
16 </head>
17 <body>
18 <DIV id=icefable1>
19  <DIV>欢迎访问<a href="<a href="http://webym.cn/blog" target="_blank">http://webym.cn/blog</a>" target="_blank"><a href="http://webym.cn/blog" target="_blank">http://webym.cn/blog</a></a></DIV>
20  <DIV>aidli.com/bbs地理论坛诚征版主中...</DIV>
21  <DIV>邮箱： yangzhy@163.com</DIV>
22  <DIV>广告合作:QQ164890072</A>
23  </DIV>
24 </DIV>
25 <SCRIPT>
26  marqueesHeight=26;
27  stopscroll=false;
28  with(icefable1)
29  {
30   style.width=0;
31   style.height=marqueesHeight;
32   style.overflowX="visible";
33   style.overflowY="hidden";
34   noWrap=true;
35   onmouseover=new Function("stopscroll=true");
36   onmouseout=new Function("stopscroll=false");
37  }
38  preTop=0;
39  currentTop=marqueesHeight;
40  stoptime=0;
41  icefable1.innerHTML+=icefable1.innerHTML;
42 
43  function init_srolltext()
44  {
45   icefable1.scrollTop=0;
46   setInterval("scrollUp()",1);
47  }
48  init_srolltext();
49  
50  function scrollUp()
51  {
52   if(stopscroll==true) return;
53   currentTop+=1;
54   if(currentTop==marqueesHeight+1)
55   {
56    stoptime+=1;
57    currentTop-=1;
58    if(stoptime==300) 
59    {
60     currentTop=0;
61     stoptime=0;    
62    }
63   }
64   else 
65   {   
66    preTop=icefable1.scrollTop;
67    icefable1.scrollTop+=1;
68    if(preTop==icefable1.scrollTop)
69    {
70     icefable1.scrollTop=marqueesHeight;
71     icefable1.scrollTop+=1;   
72    }
73   }    
74  }
75  init_srolltext();    
76 </SCRIPT>
77 </body>
78 </html>

posted on 2010-12-16 10:35 Dufe王彬阅读(364) 评论(0) 编辑收藏举报