一个js代码调度

http://wanghao29791.webk.datasir.com/3.html
大家看看这是js的marquee
里面有图片在向左移动
上面有两个按钮，
当点向左时，图片向左快速移动,
当点向右时，图片向右移动，
现在向左按钮实现了,但是向右移动按钮不会实现。
大家谁帮我看看呗

解决方案 »

  1.   

    <html>
    <head>
    <style type="text/css">
    <!--
    #demo {
    background: #FFF;
    overflow:hidden;
    border: 1px dashed #CCC;
    width: 500px;
    }
    #demo img {
    border: 3px solid #F2F2F2;
    }
    #indemo {
    float: left;
    width: 800%;
    }
    #demo1 {
    float: left;
    }
    #demo2 {
    float: left;
    }
    -->
    </style>
    </head>
    <body>
    <input type = "button" id  = "left"/>
    <div id="demo">
    <div id="indemo">
    <div id="demo1">
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    <a href="http:\\www.baidu.com" target = "_blank"><img src="http://www.cnrui.cn/other/link/Clear_logo.gif" border="0" /></a>
    </div>
    <div id="demo2"></div>
    </div>
    </div>
    <input type = "button" id  = "right"/>
    <script>
    <!--
    var speed=25; //数字越大速度越慢
    var tab=document.getElementById("demo");
    var tab1=document.getElementById("demo1");
    var tab2=document.getElementById("demo2");
    var left = document.getElementById("left")
    var right = document.getElementById("right");
    tab2.innerHTML=tab1.innerHTML;
    function Marquee(){
    if(tab2.offsetWidth-tab.scrollLeft<=0)
    tab.scrollLeft-=tab1.offsetWidth
    else{
    tab.scrollLeft++;
    }
    }
    function Marquee_right()
    {
        if(tab2.offsetWidth-tab.scrollLeft<=0)
    tab.scrollLeft+=tab1.offsetWidth
    else 
    {
    tab.scrollLeft--;
    }}
    //var MyMar=setInterval(Marquee,speed);left.onmouseover=function() {MyMar=setInterval(Marquee,speed - 5)};
    left.onmouseout=function() {clearInterval(MyMar)};
    right.onmouseover = function (){MyMar = setInterval(Marquee_right,speed - 5)};
    right.onmouseout = function(){clearInterval(MyMar)};
    -->
    </script>
    </body>
    </html>
      

  2.   

    上下左右<html>
    <head>
    <style> img{width:270px} </style>
    </head>
    <body>
    开始： <a id=sha href= "javascript:up() "> 向上 </a> <a id=xia href= "javascript:down() "> 向下 </a>
    <div id=demo style=overflow:hidden;height:200;width:260;background:#214984;color:#ffffff>
    <div id=demo1>
    <img  src= "http://avatar.profile.csdn.net/7/7/0/2_sq_zhuyi.jpg"> <br> 
    <img src= "http://avatar.profile.csdn.net/7/E/2/2_yurui05.jpg"> <br> 
    <img src= "http://avatar.profile.csdn.net/9/C/3/2_spirit_zyl.jpg"> <br> 
    <img src= "http://avatar.profile.csdn.net/B/B/A/2_cb1156.jpg">
    </div> <div id=demo2> </div>
      </div>
      <script>
    function up(b)
    {
      var speed=5
      demo2.innerHTML=demo1.innerHTML
      function Marquee()
      {
      if(demo2.offsetTop-demo.scrollTop<=0)
      demo.scrollTop-=demo1.offsetHeight
      else
      demo.scrollTop++
      }
      var MyMar=setInterval(Marquee,speed)
      demo.onmouseover=xia.onmousedown=function() {clearInterval(MyMar)}//鼠标移上时清除定时器滚动停止
      demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器
    }
    function down()
    {
        var speed=5
        demo2.innerHTML=demo1.innerHTML
        demo.scrollTop=demo.scrollHeight
        function Marquee()
        {
        if(demo1.offsetTop-demo.scrollTop>=0)
        demo.scrollTop+=demo2.offsetHeight
        else
        demo.scrollTop--
        }
        var MyMar=setInterval(Marquee,speed)
        demo.onmouseover=sha.onmousedown=function() {clearInterval(MyMar)}
        demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    }
    </script>
    开始： <a id=zuo href= "javascript:left() "> 向左 </a> <a id=you href= "javascript:right() "> 向右 </a>
    <div id=demor style=overflow:hidden;height:200;width:800;background:#214984;color:#ffffff>
    <table align=left cellpadding=0 cellspace=0 border=0>
    <tr><td id=demor1 valign=top>
    <img src="http://avatar.profile.csdn.net/7/7/0/2_sq_zhuyi.jpg">
    <img src="http://avatar.profile.csdn.net/7/E/2/2_yurui05.jpg">
    <img src="http://avatar.profile.csdn.net/9/C/3/2_spirit_zyl.jpg">
    <img src="http://avatar.profile.csdn.net/B/B/A/2_cb1156.jpg">
    </td>
    <td id=demor2 valign=top></td>
    </tr></table>
    </div>
    <script>
    function left()
    {
      var speed=5;
      demor2.innerHTML=demor1.innerHTML;
      function Marquee(){
      if(demor2.offsetWidth-demo.scrollLeft<=0)
      demor.scrollLeft-=demor1.offsetWidth
      else{
      demor.scrollLeft++;
      }
      }
      var MyMar=setInterval(Marquee,speed);
      demor.onmouseover=you.onmousedown=function() {clearInterval(MyMar);};
      demor.onmouseout=function() {MyMar=setInterval(Marquee,speed);};
    }
    function right()
    {
      var speed=5;
      demor2.innerHTML=demor1.innerHTML;
      demor.scrollLeft=demor.scrollWidth;
      function Marquee(){
      if(demor.scrollLeft<=0)
      demor.scrollLeft+=demor2.offsetWidth;
      else{
      demor.scrollLeft--;
      }
      }
      var MyMar=setInterval(Marquee,speed);
      demor.onmouseover=zuo.onmousedown=function() {clearInterval(MyMar);};
      demor.onmouseout=function() {MyMar=setInterval(Marquee,speed);};
    }
      </script>
    </body>
    </html>