小编And*_*aro的帖子

页面向上/向下事件的动画滚动

我正在尝试构建一个网站,当用户向上或向下滚动页面时,该网站会自动滚动到每个部分.我已经试图解决这个问题好几个星期,并希望对此事有任何帮助.我相信问题是因为事件处理程序是一个滚动事件,它触发一个滚动函数,这会导致多个滚动发生.我已经阅读了很多讨论这个主题的文章,解决方案似乎是添加了一个setInterval或setTimeout函数,但是我已经尝试了两个并且仍然没有结果.

var page = $("#page_container");
var home = $("#home");
var musicians = $("#musicians");
var athletes = $("#athletes");
var politics = $("#politics");
var bio = $("#bio");
var pages = [home, musicians, athletes, politics, bio];
var scrolled = false;
var pageCur = 0;
var lastScrollTop = 0;

page.scroll(function () {
    scrolled = true;
});

var scrollTimeout = setInterval(function () {
    if (scrolled == true) {
        pageScroll();
    }
    else {
        clearTimeout(scrollTimeout);
    }
}, 3000);

function pageScroll() {
    if (scrolled == true) {
        scrolled …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery dom

8
推荐指数
1
解决办法
252
查看次数

滚动功能触发多次而不是一次

我正在尝试创建一个网站,通过一个滚动操作即可自动滚动到每个部分。这意味着代码必须检查页面是向上滚动还是向下滚动。我相信下面的代码可以解决我的问题,但是在滚动页面时,滚动动作被触发了多次。您将看到if语句中的第一个警报达到5而不是所需的1。对此事的任何帮助将不胜感激。

[注意]我正在使用velocity.js库滚动到容器中的每个部分。

var page = $("#content-container");
var home = $("#home-layer-bottom");
var musicians = $("#musicians");
var athletes = $("#athletes");
var politics = $("#politics");
var bio = $("#politics");
var pages = [ home,musicians,athletes,politics,bio ];

var pageCur = 0;


var lastScrollTop = 0;
page.scroll(function(){

var st = $(this).scrollTop();
var pageNex = pageCur + 1;

if (st > lastScrollTop){
    alert(pageNex);
pages[pageNex].velocity("scroll", { container: $("#content-container") });
} else {
   alert(pageCur-1);
pages[pageCur-1].velocity("scroll", { container: $("#content-container") });
}
lastScrollTop = st;
pageCur = pageNex;
});
Run Code Online (Sandbox Code Playgroud)

javascript arrays jquery scroll infinite-scroll

1
推荐指数
2
解决办法
6546
查看次数

标签 统计

javascript ×2

jquery ×2

arrays ×1

css ×1

dom ×1

html ×1

infinite-scroll ×1

scroll ×1