javascript - 在某个点暂停滚动片刻

标签 javascript jquery

我希望让用户向下滚动页面,当它到达某些点时“停留”片刻,然后再继续滚动。我有一个大的垂直页面,在大图像之间有内容,当用户点击这些内容时,浏览器应该停止滚动一会儿然后继续滚动。我希望这将有助于突出显示页面上所有图像中的内容。

我希望这已经够清楚了:s

干杯

最佳答案

你可以尝试这样的事情:

$(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);
     });
   })();
});

演示:http://jsfiddle.net/aamir/eFmZj/7/show

播放:http://jsfiddle.net/aamir/eFmZj/7/

关于javascript - 在某个点暂停滚动片刻,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16484521/

相关文章:

javascript - 如何使用 javascript 删除动态创建的 json 对象中的多余引号?

javascript - 每次从浏览器重新加载时如何打开特定的url页面?

jquery - MVC Controller 参数为空

jquery - 如果属性与过滤器不匹配则隐藏 div 元素

javascript - 带扩展名的文件名验证

javascript - 无法使用 Vue 打包库加载 CSS 文件(npm)

javascript - 关于下拉菜单

javascript - JSX 编译器输出不是有效的 JavaScript

javascript - 使用下拉框仅显示选定的 div,但在未选择任何选项时显示所有 div

javascript - slider 和光滑轮播之间的 Jquery 文件冲突