Question

68

Javascript: do an action after user is done scrolling

rated 0 times [ 72] [ 4] / answers: 1 / hits: 29995 / 14 Years ago, sat, november 27, 2010, 12:00:00

I'm trying to figure out a way to do this. I have a list of boxes, each about 150px high. I am using javascript (and jquery) and want that, after a user scrolls down a page, the page will auto scroll so that the boxes line up with the rest of the page (that is to say, if the user scrolls and the y position of the page is not divisible by 150, it will scroll to that nearest point).

Now, I at the moment, I know I can activate an event using the .scroll() jquery event, and I can make it move to a certain point using .scrollTop(). But every pixel the user moves the scroll bar activates the whole function. So is there a way to delay the function from firing until the user hasn't scrolled, and if they should begin to scroll again, the function will halt?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

frederickmohamedw

Add To Favorites

Follow

Total Points: 21

Total Questions: 123

Total Answers: 105

Location: The Bahamas

Member since Tue, Apr 27, 2021

3 Years ago

frederickmohamedw questions

1 React JS. How can I display the image inside the object?

Wed, Sep 23, 20, 00:00, 4 Years ago

1 Vuetify data table :item-class doesn't do anything

Sat, Jul 18, 20, 00:00, 4 Years ago

1 How to show modal on component/page created/load in Vue.js

Sun, Apr 26, 20, 00:00, 4 Years ago

1 File type from buffer using file-type

Sat, Jan 11, 20, 00:00, 4 Years ago

1 Slick Slider Mobile Responsiveness

Fri, Dec 27, 19, 00:00, 4 Years ago

View All

answered 14 Years ago jocelyntrishar · Accepted Answer

As you are already using jQuery, have a look at Ben Alman's doTimeout plugin which already handles the debouncing of methods (which is what you are after).

Example shamelessly stolen from his website:

$(window).scroll(function(){

   $.doTimeout( 'scroll', 250, function(){

      // do something computationally expensive

   });

});