iScroll4，如何在div滚动时调用函数? [英] IScroll4, how to call functions when the div is scrolling?

问题描述

当用户在iScroll4中滚动时，我想调用一些操作.还取决于滚动的位置和速度.

I want to call some actions, when the user is scrolling in iScroll4. Also depending on the position and speed on the scrolling.

在何处以及如何最好地实现这一目标?

Where and how to hook in best to achive this?

对于 addListener ，我没有运气，因为它会对按时事件做出反应，例如.触摸移动，触摸开始.我需要知道div何时滚动..

With addListener I had no luck, because it reacts on on-time events, eg. Touchmove, touchstart. What i need is to know when the div is scrolling..

有什么想法吗?

推荐答案

有很多回调函数iScroll.您可以将其用于您的目的.

There are lot of callback functions iScroll. You can use those for your purposes.

关于这些的小解释.

scroller = new iScroll('ID', {
  onRefresh : function(){
    /* iScroll provided feature to refresh the scroller. This will help to refresh the scroller container when you dynamically add contents. */
  },
  onBeforeScrollStart : function(e){
    /* this is nothing but just when your mousedown event (This will be triggered each and every mousedown event). This is very useful when your parent container have scroller and your child container also have scroller. Assume this is your child scroller. What you can do is just get your parent scroller object (parentScroller) and disable it "parentScroller.disable()" */
  },
  onScrollStart : function(){
    /* now you start to move your mouse while holding mouse left button */
  },
  onBeforeScrollMove : function(){
    /* this where your scroller is start to move actually */
  },
  onScrollMove : function(){
    /* now your scroller is moving. If you need to do something, when your scroller is moving you can do those here */
  },
  onBeforeScrollEnd : function(){
    /* your scroller movement is about to stop */
  },
  onScrollEnd : function(){
    /* your scorller movement stoped. Will say you have disable your parent scroller. Now this is the good place to enable your parent scroller "parentScroller.enable()"*/
  },
  onDestroy : function(){
    /* you destroy your scroller. iScroll is provide a feature to remove the attached sctoller. */
  }
});

我只给了您一些回调函数的小解释.但是还有更多的内容，例如onTouchEnd，onZoomStart，onZoom，onZoomEnd.您可以根据需要进行实验.

I just gave you a small explanation about the some of callback functions. But there are some more exists such as onTouchEnd, onZoomStart, onZoom, onZoomEnd. You can experiment those if you need.

我希望这可以帮助您解决问题.

I hope this might help you to sort out issue.

---

最新更新以获取滚动条的位置和速度.

scroller = new iScroll('ID', {
  onScrollMove : function(e){
    /* this function return an object in which it has almost all the required stuffs. */
  }
});

供参考console.log(e)并分析e的值.它返回很多x & y头寸.从这些中，您可以直接获得滚动条的位置.但是要获得滚动器的速度，您必须使用physics;).它返回timestamp，scroller position.我认为您可以使用这些值来获得速度.很抱歉，目前我无法分析这些值以确切说明如何获取speed.但是我认为您可以使用可用的值来计算速度.

For your reference console.log(e) and analyze the value e has. It return lot of x & y positions. From those you can get the scroller position directly. But to get the speed of the scroller you have to use physics ;). It returns timestamp, scroller position. I think you might to able to get the speed using these values. I am sorry at the moment I could not analyze these values to exactly say how you can get the speed. But I think you can calculate speed using the values available.

这篇关于iScroll4，如何在div滚动时调用函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！