jQuery - how to treat scroll as single event?

Question

When I bind function to scroll and scroll mousewheel once, the function runs seven or eight times. I want it to run only once when I scroll the mousewheel once, is this possible? I use this code:

$(document).ready(function () {
    $(window).bind('scroll', function() {
        alert("Scroll.");          
    }   
    });
});

Answer 1

Try

$(document).ready(function () {
    var timerId;
    $(window).bind('scroll', function() {
        clearTimeout(timerId)
        timerId = setTimeout(function(){
            alert("Scroll.");          
        }, 200)
    });
});

Demo: Fiddle

Answer 2

You can use throttle function from jQuery throttle debounce plugin.

$(function() {
    $(window).bind('scroll', $.throttle(100, function() {
        console.log('scroll');
    }));
});