I need some pointers on how to implement inertia

Ok, so I've created a little plugin that takes a bunch of elements and creates a sort of never ending list. I'll try to explain...

I have a div, and it's got about 20 elements tags in it. When the user scrolls up, the top element moves out of view and is moved to the bottom of the li开发者_如何转开发st. And vice-versa so that when the user scrolls down, the bottom element is moved to the top of the list.

This is specifically for Mobile Safari (iPad, iPhone) web content

What I would like to do is implement inertia so the scrolling slows to a halt in response to how fast or slow the user is scrolling when their finger leaves the screen. Just like the inertia commonly found in the iPhone / iPad UI.

The problem is, every time an element moves to the top or the bottom of the list, the scollTop value for the parent div is adjusted to make it look like all the elements are staying in the same place. Which means the scrollTop value is never more than the top elements total height. So there's no value I can think of that I can keep on manipulating to give the illusion of inertia.

I'm stumped. Does anyone have any suggestions?

iScroll implements scrolling with inertia, but I'm not sure how it would react to you adding and removing elements mid-scroll. Might be worth looking into though.