Div click + drag velocity too high?

I created (http://jsfiddle.net/XMhMR/1/) a simple div that you can click and drag. Whenever you click and drag, though, the div moves at lightning speed.

I w开发者_StackOverflow社区ant more of a Google Maps-style click and drag, where it's not so fast. I tried dividing the deltas by a factor of 10, but it strangely accelerates and decelerates. Anyone know what's going on?

You should be handling your scroll variables the same way you handle the "current position". Store them in the object rather than grabbing them each time. You're basically adding each movement in every time it moves. If you move by 2 px, then another 2, the first time you move by 2, then the 2nd time you move by 2+2. But you've already moved by 2 so now you're moving by 6 instead of 4... this builds to get really fast eventually.

http://jsfiddle.net/XMhMR/3/

Nevermind, I found out I was being a fool. The fixed version is here: http://jsfiddle.net/XMhMR/2/.

In summary: Don't recalculate the scrollLeft and scrollTop positions on every mousemove event, because that in effect redoubles the delta, causing acceleration.