Pause scrolling at certain point for a short while

Question

I'm looking to have the user scroll down the page and when it hits certain points 'stick' for a few moments before continuing scrolling. I have a large vertial page which has content in between large images, when the user hits these peices of content the browser should stop scrolling for a moment then continue scrolling. I'm hoping this will help highlight the content amongst all the images on the page.

I hope this is clear enough :s

cheers

This is a perfectly valid question, but as a user I think I would find this behavior frustrating. There are other ways of making content stand out in a large page that don't require overriding default browser behavior. — ASGM, May 10 '13 at 14:28
POssible duplicate: http://stackoverflow.com/questions/4770025/how-to-disable-scrolling-temporarily — Kasyx, May 10 '13 at 14:30
You could use the "endless scroll" plugins available... Load only up until the content you want to pause on, then load the next chunk etc. — Jeff Watkins, May 10 '13 at 14:37

score 0 · Answer 1 · answered May 10 '13 at 16:37

You can try something like this:

$(function () {
  var delay = 2000,
    //Following var because http://stackoverflow.com/questions/3042651/jquery-scrolltop-not-working-in-chrome-but-working-in-firefox
    $scrollEl = $.browser.mozilla ? $('html') : $('body');
    selectors = ['#img1', '#img2', '#img3'];

  (function scrollPage() {
     var $el = $(selectors.shift());
     if ($el.length === 0) return;

     //animate
     $scrollEl.animate({ scrollTop: $el.offset().top }, 2000, function () {
        setTimeout(scrollPage, delay);
     });
   })();
});

Demo: http://jsfiddle.net/aamir/eFmZj/7/show

Play: http://jsfiddle.net/aamir/eFmZj/7/

Pause scrolling at certain point for a short while

1 Answers1