jQuery window scroll event. For every XX pixels scrolled

Question

I am using the excellent jQuery Reel plugin (http://jquery.vostrel.cz/reel) for a project. I would like to bind to the window scroll event, so when the user scrolls down the page the plugin advances 1 frame for say every 10px scrolled, if the user scrolls up the animation is reversed. The plugin has methods I can pass the values to no problem and I know how to bind to the window scroll event. What I am struggling with is the last. How can I use jQuery/JavaScript to say for every 10 pixels scrolled in any vertical direction advance 1 frame in the animation? I know I can store the window scroll in a variable but I'm unsure how to say every time it hits a multiple of 10 advance one frame. Many thanks in advance. EDIT Thanks to help of the users below I worked out a solution. As follows: ``` $(window).scroll(function() { windowScrollCount = $(this).scrollTop(); animationFrame = Math.round(windowScrollCount / 100); }); ``` So here I am getting the scrolled distance in windowScrollCount, tr…

Accepted Answer

Thanks to help of codef0rmer and noShowP I worked out a solution. As follows:

```
$(window).scroll(function()
{
    windowScrollCount   = $(this).scrollTop();
    animationFrame      = Math.round(windowScrollCount / 100);
});
```

So here I am getting the scrolled distance in windowScrollCount, translating it into frames in animationFrame and setting it back with .reel("frame", animationFrame); I am actually doing this for every 100 frames as every 10 was to quick.

jQuery window scroll event. For every XX pixels scrolled

Solution

Problem