图片左右滚动的，但是走一段时间就不走啦，请各位高手指教

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>左右翻滚的图片展示</title>
<style type="text/css">
*{margin:0;padding:0; text-align:center;}
  ul{list-style:none}
  #wrap{width:600px;border:1px solid orange;height:80px;overflow:hidden;}
  #a li,#b li{float:left;width:160px;height:60px;margin-left:10px  line-height:80px;}
  #scrolls{width:200%;float:left;}
  #a,#b{float:left;}
  .left,.right{width:20px;height:20px;background:yellow;cursor:pointer;}
</style>
</head>
<body style="width:920px; weidth:60px;magrgin:0 auto; text-align:center; ">
<div class="left" id="left" onClick="left()"><<</div>
  <div id="wrap">
    <div id="scrolls">
      <div id="a">
        <ul>
          <li><img src="image/1.jpg" style="width:160px;height:60px;"/></li>
          <li><img src="image/2.jpg" style="width:160px;height:60px;"/></li>
          <li><img src="image/3.jpg" style="width:160px;height:60px;"/></li>
          <li><img src="image/4.jpg" style="width:160px;height:60px;"/></li>
          <li><img src="image/5.jpg" style="width:160px;height:60px;"/></li>
  <li><img src="image/6.jpg" style="width:160px;height:60px;"/></li>
        </ul>
      </div>
      <div id="b"> </div>
    </div>
    <script type="text/javascript">
      var $ = function(id){return document.getElementById(id)};
      var wrap = $("wrap");
      var a = $("a");
      var b = $("b");
      var show = $("show");
      var d;
      b.innerHTML = a.innerHTML;
      function scrolls(){
      d = "n";
        if(b.offsetWidth - wrap.scrollLeft <=0){
         wrap.scrollLeft = wrap.scrollLeft - b.offsetWidth;
        }
        else{
         wrap.scrollLeft++;
        }
      }
      
      t = setInterval("scrolls()",10)
      
      function backScrolls(){
        if(wrap.scrollLeft <=0){
         wrap.scrollLeft = wrap.scrollLeft + b.offsetWidth;
        }
        else{
         wrap.scrollLeft--;
        }
      }
      function left(){
        d = "n";
        clearT();
        t = setInterval("scrolls()",10);
      }
      function right(){
        d = "m";
        clearT();
        t = setInterval("backScrolls()",10);
      }
      function clearT(){
       clearInterval(t);
      }
      function runs(){
        if(d == "n"){
          left();
        }
        else{
          right();
        }
      }
      wrap.onmouseover = function (){
        clearT();
      }
      wrap.onmouseout = function(){
        runs();
      }
   </script>
  </div>
<div class="right" id="right" onClick="right()">>></div>
</body>
</html>

解决方案 »

  1.   

    　演示地址:http://www.popub.net/script/MSClass.html
      

  2.   

     div标签有几个没有结束标签
      

  3.   

    你在什么浏览器下测试的？走多久才停的？我在chrome下测试的，一直在走。。
      

  4.   

    很多ff，ie各个版本都出现了走一段时间就停止的，我初步怀疑是 b.innerHTML = a.innerHTML;不起作用
      

  5.   

    是不是你放的DIV没定高度，导致他获取高度出错，我以前也遇到类似的，貌似在最外面的DIV加position:relative;就好
      

  6.   

    我用过ie8， 用firefox，用谷歌，三个浏览器没有一个是好的，ie8的话，倒没有出现没有停止的，但是却出现了连接不连续的情况，其他两个浏览器都是出现了停下来的，真的很想这到底是为什么会出现这样的情况的？请各位高手帮帮忙的？
      

  7.   

    老问题了。
    一般是内容宽度小于外框宽度的原因。想理解滚动原理的话：
    找到 overflow:hidden;
    改为 overflow:scroll;
    仔细观察一下滚动条的变化。