开发者

Trying to implement scrolling inertia with jQuery

开发者 https://www.devze.com 2022-12-27 11:26 出处:网络
I\'m trying to add some iPhone style scrolling inertia to a web page that will only be viewed on the iPad.

I'm trying to add some iPhone style scrolling inertia to a web page that will only be viewed on the iPad.

I have the scrolling working in one direction (scrollLeft), but it doesn't work in the other direction. It's a pretty simple function:

function onTouchEnd(event){
                event.preventDefault();
                inertia = (oldMoveX - touchMoveX);
                
                // Inertia Stuff
                if( Math.abs(inertia) > 10 ){

                    $("#feedback").html(inertia);
                    
                    $("#container").animate({
                        'scrollLeft': $("#container").scrollLeft() + (inertia * 10)
                    }, inertia * 20);
          开发者_如何学JAVA          
                }else{
                    
                    $("#feedback").html("No Inertia");
                    
                }
                
            }

I've bound it to the touchend event on the body. The inertia is the difference between he old moveX position and the latest moveX position when a touch ends.

I then try to animate the scrollLeft property of a div that contains a bunch of thumbnails. As I've said, this works when scrolling to the left, but not when scrolling to the right.

Any ideas?


the 2nd argument to "animate(...)" is the duration, which must not be negative.

try:

...
$("#container").animate({
      'scrollLeft': $("#container").scrollLeft() + (inertia * 10)
   }, Math.abs(inertia * 20));
...
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号