Geek asks and answers

How to determine when the user is actively scrolling?

My page has a scrollable area containing several elements. Each element starts a function when it hangs.

My problem is that if the user scrolls up or down with the mouse, the function launches every element that the cursor passes when the area scrolls below.

Is there a way by which I can run a function when I hover only if the user is not actively scrolling?

The jQuery inline .scroll()doesn't seem to be what I need, since the scroll event only fires when the scroll starts. I need to know if the scroll "is on," so to speak.

UPDATE: Here is my current code:

$container.find('div.item').each(function(i, e){
     $(e).hover(
          function(){
               $(this).toggleClass('expanded');
               // other functions here
          },
          function(){
               $(this).toggleClass('expanded');
          }
     );
});

, .hover(), .

+5
1

setTimeout mouseenter, clearTimeout mouseleave, , , .

, . , , , .

, :

$(function() {
    "use strict";
    var $container = $("#container"),
        timeout, self;

    $container.find("div").each(function() {
        $(this).hover(
            function() {
                self = this;
                timeout = setTimeout(function() {
                    $(self).css({
                        width : 500,
                        height: 500
                    });
                }, 500);
            },
            function() {
                clearTimeout(timeout);
                $(this).css({
                    width : 300,
                    height: 300
                });
            }
        );
    });
});

: http://jsfiddle.net/sQVe/tVRwm/1/

, , 500 .

.each() , .hover() div. .each(), , , hover.

+3

More articles:


All Articles