注:上下滚动时,单元格demo1里面的内容高度要大于demo设置的高度才能无限滚动
  
       左右滚动时,单元格demo1里面的内容宽度要大于demo设置的宽度才能无限滚动
  
一、上下滚动
  
 
1.显示的内容
  
<div id="demo" style="OVERFLOW: hidden; WIDTH: 200px; HEIGHT: 100px; ">
  
<table border="0" cellpadding="0" cellspacing="0">
  
<tr>
  
   <td id="demo1"><table width="100%" height="99" border="0" cellpadding="0" cellspacing="0">
  
          <tr>
  
            <td>一</td>
  
          </tr>
  
          <tr>
  
            <td>二</td>
  
          </tr>
  
          <tr>
  
            <td>三</td>
  
          </tr>
  
        </table></td>
  
</tr>
  
<tr>
  
   <td id="demo2"></td>
  
</tr>
  
</table>
  
</div>
  
 
2.向上滚动JS
  
 
<SCRIPT>
  
var speed=30
  
var MyMarh=setInterval(Marqueeh,speed)
  
demo2.innerHTML=demo1.innerHTML
  
//原理是不断的向demoh2中填入demoh1中的内容,然后将已经看不见的清除
  
//用一个两行一列的表格,上一列再放一个装填有内容的表格,定义为demoh1,下一列是空的TD,定义为demoh2
  
//SPEED是用来控制速度的。
  
demo.onmouseover=function(){ clearInterval(MyMarh) }
  
demo.onmouseout=function(){ MyMarh=setInterval(Marqueeh,speed) }
  
function Marqueeh(){
  
if(demo2.offsetHeight-demo.scrollTop<=0)
  
   demo.scrollTop-=demo1.offsetHeight
  
else{
  
   demo.scrollTop++
  
}
  
}
  
</SCRIPT>
  
 
3.向下滚动JS
  
 
<script>
  
var speed=30
  
demo2.innerHTML=demo1.innerHTML
  
demo.scrollTop=demo.scrollHeight
  
var MyMar=setInterval(Marquee,speed)
  
 
 
demo.onmouseover=function() {clearInterval(MyMar)}
  
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  
function Marquee(){
  
if(demo1.offsetTop-demo.scrollTop>=0)
  
   demo.scrollTop+=demo2.offsetHeight
  
else{
  
   demo.scrollTop--
  
}
  
}
  
</script>
  
 
二、左右滚动
  
 
1.显示内容
  
 
<div id="demo" style="overflow:hidden;height:100px;width:200px;">
  
<table cellpadding="0" cellspace="0" border="0">
  
<tr>
  
<td id="demo1"><table width="200" border="0" cellspacing="0" cellpadding="0">
  
    <tr>
  
      <td>一</td>
  
      <td>二</td>
  
      <td>三</td>
  
    </tr>
  
</table></td>
  
<td id="demo2"></td>
  
</tr>
  
</table>
  
</div>
  
 
2.向左滚动JS
  
 
<script>
  
var speed=30
  
var MyMar=setInterval(Marquee,speed)
  
demo2.innerHTML=demo1.innerHTML
  
demo.onmouseover=function() {clearInterval(MyMar)}
  
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  
function Marquee(){
  
if(demo2.offsetWidth-demo.scrollLeft<=0)
  
   demo.scrollLeft-=demo1.offsetWidth
  
else{
  
   demo.scrollLeft++
  
}
  
}
  
</script>
  
 
3.向右滚动JS
  
 
<script>
   
var speed=30
  
var MyMar=setInterval(Marquee,speed)
  
demo2.innerHTML=demo1.innerHTML
  
demo.onmouseover=function() {clearInterval(MyMar)}
   
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  
function Marquee(){
   
if(demo.scrollLeft<=0)
   
   demo.scrollLeft+=demo2.offsetWidth
   
else{
   
   demo.scrollLeft--
   
}
   
}
   
</script>