鼠标光标控制屏幕滚动的问题

我想实现通过鼠标光标控制屏幕滚动：当光标在屏幕的上半部分时，屏幕自动往上滚动；当光标在屏幕的下半部分时，屏幕自动往下滚动。只使用scrolldown函数或只使用scrollup函数时，一切正常，可是scrolldown和scrollup同时使用时，屏幕一直在抖动。请教各位老师，如何解决此问题。
代码如下：
<script>   
  var currentpos,timer;     
  function stop(){
  clearInterval(timer);   
  }
  function scrolldown()     
  {     
  currentpos=document.body.scrollTop;
  window.scroll(0,++currentpos);     
  if (currentpos = document.body.scrollHeight)     
  stop();
  }
  function scrollup()     
  {     
  currentpos=document.body.scrollTop;     
  window.scroll(0,--currentpos);
  if(currentpos = 0)     
  stop();
  }    function mousePosition(ev){
if(ev.pageX || ev.pageY){
   return {x:ev.pageX, y:ev.pageY};
   }
   return {
   x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
   y:ev.clientY -  document.body.clientTop
   }; 
} 
function mouseMove(ev){
ev = ev || window.event;
var mousePos = mousePosition(ev);
document.getElementById('xxx').value = mousePos.x;
document.getElementById('yyy').value = mousePos.y;
 if (mousePos.y>window.screen.availHeight/2)
 {
  timer=setInterval('scrolldown()',100);
 }
 if (mousePos.y<window.screen.availHeight/2)
 {
  timer=setInterval('scrollup()',100);
 }
}
document.onmousemove = mouseMove;</script><script>
for(var i=0;i<15;i++)   
   document.writeln("<p>"+i); 
</script>
X:<input id="xxx" type="text" />   Y:<input id="yyy" type="text" />
<script>
for(var i=15;i<30;i++)   
   document.writeln("<p>"+i); 
</script>

解决方案 »

  1.   


    <html>
    <head>
    <script>  
      var currentpos,timer;    
      function stop(){ 
      clearInterval(timer);  
      } 
    function scroll(speed)
    {
    tmp=speed;
    document.body.scrollTop=document.body.scrollTop+tmp;
    if (tmp==0) return;
    setTimeout("scroll(tmp)",20);
    } function mousePosition(ev){ 
    if(ev.pageX || ev.pageY){ 
      return {x:ev.pageX, y:ev.pageY}; 
      } 
      return { 
      x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, 
      y:ev.clientY -  document.body.clientTop 
      }; 
    } 
    function mouseMove(ev){ 
    ev = ev || window.event; 
    var mousePos = mousePosition(ev); 
    document.getElementById('xxx').value = mousePos.x; 
    document.getElementById('yyy').value = mousePos.y; 
    if (mousePos.y>window.screen.availHeight/2) 
    { 
    scroll(3)
    } 
    if (mousePos.y <window.screen.availHeight/2) 
    { 
    scroll(-3)
    } 
    } 
    document.onmousemove = mouseMove; </script> <script> 
    for(var i=0;i <15;i++)  
      document.writeln(" <p>"+i); 
    </script> 
    X: <input id="xxx" type="text" />  Y: <input id="yyy" type="text" /> 
    <script> 
    for(var i=15;i <30;i++)  
      document.writeln(" <p>"+i); 
    </script>
    </head>
    <body>
    aaa
    </body>
    </html>
    IE下测试通过。
      

  2.   

    IE6，7，8通过
    另外Speed=0的时候停止。
      

  3.   

    感谢Dothwinds不吝赐教，我是在做一个触摸屏机的页面时遇到以上问题，因为要手指指向滚动内容，想到只有通过这种方法才能提供最方便的效果。再次感谢Dothwinds，祝您晚安！
      

  4.   

    补充一下，如果页面顶部加入<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">，则不能滚动。
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    这是标准模式DTD，呵呵，可能有一些冲突。祝LZ好运