Trying to implement scrolling inertia with jQuery

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));
...