替代MARQUEE,没有空白连续滚动

Calendar 五月 25, 2007 | Posted by admin

替代MARQUEE,没有空白连续滚动代码


纵向滚动

  1.  <div id="mar"   style="overflow:hidden;height:150px;">
  2.   <div id="mar1">
  3.  1<br>2<br>3<br>4<br>5<br>6<br>7<br>
  4.  8<br>9<br>0<br>11<br>12<br>13<br>
  5.   </div>
  6.      <div id="mar2"></div>
  7.      <div class="clear"><img name="" src="" width="1" height="10" alt="" /></div>
  8.  </div>
  9.  
  10.  <script>
  11.  var speed=10
  12.  var t=mar.scrollTop
  13.  mar2.innerHTML=mar1.innerHTML
  14.  function qswhMarquee(){
  15.  if(mar2.offsetTop-mar.scrollTop<=0)
  16.  mar.scrollTop-=mar1.offsetHeight
  17.  else
  18.  mar.scrollTop++
  19.  }
  20.  inter=setInterval(qswhMarquee,speed)
  21.    mar.onmouseover=function() {clearInterval(inter)}
  22.    mar.onmouseout=function() {inter=setInterval(qswhMarquee,speed)}
  23.  </script>

横向滚动

  1.  <div id="demo" style="overflow:hidden;width:100;background-color=#C0E8F0">
  2.    <table width="100%" border=0 cellpadding=0 bgcolor="#C0E8F0" cellspace=0>
  3.      <tr>
  4.        <td id="demo1" valign=top>
  5.        <table border=0 cellpadding=0 cellspacing=0 width=100%>
  6.            <tr>
  7.              <td width="200">
  8.                1234567890abcdefg</td>
  9.              <td valign=top width="10">&nbsp;</td>
  10.            </tr>
  11.          </table>
  12.          </td>
  13.        <td id="demo2" valign="top"></td>
  14.      </tr>
  15.    </table>
  16.  </div>
  17.  <script>
  18.    var speed=2//速度数值越大速度越慢
  19.    demo2.innerHTML=demo1.innerHTML
  20.    function Marquee(){
  21.    if(demo2.offsetWidth-demo.scrollLeft<=0)
  22.    demo.scrollLeft-=demo1.offsetWidth
  23.    else{
  24.    demo.scrollLeft++
  25.    }
  26.    }
  27.    var MyMar=setInterval(Marquee,speed)
  28.    demo.onmouseover=function() {clearInterval(MyMar)}
  29.    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  30.  </script>

Category Categories: web | Tag Tags: | Comments No Comments »

留下评论