Change css background position multiple times

Hello I want to preview the thumbnail of a video file on hover, like www.megavideo.com but i want to do it with a sprite file. Ex: my thumb is an image of 140px width an开发者_开发百科d 560px height when i go with my mouse hover a want to switch the background position 4 time (-140px) and loop that animation while the mouse is hover. Can someone help me with that ? I'm sorry for my bad english and I'm newb with jquery. Thanks!

Apply an event handler with $.hover which uses setTimeout to adjust one axis of the background-position property by -140px every second. Store the return value of setTimeout so you can later cancel it. When the value of that axis exceeded -140 * 4, where 4 is the number of frames of animation, then reset it to 0.

You can specify a second callback function with .hover which will fire when you stop hovering; use that function to cancel the callback you last set with clearTimeout.