滚动div直到mousedown上的最后一个div

Question

iScroll 4的另一个问题。我已经建立了一个demo in JSFiddle。

我想滚动mousedown上的div。它应滚动到结尾：

• 连续;
• 没有任何中断;具有静态速度的
• ;

直到它到达最后的div，或者我在中间做了一个mouseup。

有没有可能做到这一点？

Answer 1

检查此琴：http://jsfiddle.net/z2YWZ/2/

还有一个问题。到达最后时它不会停止。 iScroll使用CSS translate来滚动，我找不到一种方法来获取当前的翻译形式。目前正在寻找解决方案。

UPDATE

iScroll有useTransform选项，使用它我们可以问它不使用翻译，而使用CSS left属性滚动。通过这种方式，我们可以轻松识别是否已达到目的（无论哪种方式）。要使用，只需在启动iScroll时设置useTransform: false即可。

更新2

检查此琴：http://jsfiddle.net/z2YWZ/12/

Answer 2

可以通过这个解决方案： http://jsfiddle.net/ugeU3/3

HTML：

<div id="click">Element to click on</div> 

JS：

jQuery("#click").bind('mousedown', function(){ 
    intInterval=setInterval(function(){ 
      myScroll.scrollTo(25, 0, 800, true); 
    },30); 
}); 
jQuery("#click").bind('mouseup', function(){ 
    intInterval=window.clearInterval(intInterval); 
}); 

您可以更改时间值来实现你的速度 - 偏好。 我希望它有帮助。

Answer 3

我已经修改@techfoobar代码，做这样的事情这两个涡旋汽车无，直到在鼠标按下结束，或缩小移动一个DIV单击。代码片段是：

 var scrolling=false; 
     var scrollTimer=-1; 
     $('#next').bind('mousedown',function() { 
      scrolling = true; 
      scrollTimer = setInterval(function() { 
       scrollDivRight(); 
      }, 100); 
      return false; 
     }); 
     $('#next').bind('mouseup',function() { 
      scrolling = false; 
      clearInterval(scrollTimer); 
      return false; 
     }); 
     $('#next').bind('mouseout',function() { /*For smoother effect and also prevent if any previous delay (eg. 100ms)*/ 
      scrolling = false; 
      clearInterval(scrollTimer); 
      return false; 
     }); 
     scrollDivRight:function(){ 
      if(!scrolling) return false; 
      myScroll.scrollTo(177, 0, 400, true);  
     } 

请建议是否有什么更好的，然后这个。当然在他的回答中提到的问题@techfoobar仍然没有解决。