Question

以下问题。我有一个长滚动页面，如果在视口中使用inview.js

，它会为每个div添加类

var $div1 = $('#div1');
var $div2 = $('#div2');
//.....
var only_once = 0;

$('#div1, #div2, #div3, #div4, #div5').bind('inview', function (event, visible) 
{
    if (visible == true) {
        $(this).addClass("inview");
    } else {
        $(this).removeClass("inview");
    }
});

当它添加类我正在做一些事件和if条件，如果inview在第一次被触发然后停止时会发生某些事情。我尝试将only_once切换为1。

if($div1.hasClass("inview")){   
    // here some functions...

    if (only_once == 0) {
        $('.float-second').css('left', 0);
        $('.float-second').css('top', 0);
        only_once = 1;
    } 

    if($div2.hasClass("inview")){   
        // here some functions...


        if (only_once == 1) {
            $('.float-third').css('left', 0);
            $('.float-third').css('top', 0);
            only_once = 2;
        } 
        // and this for the other divs too

问题是，当我这样做的时候，当网站在中间或底部加载并且我向上或向下滚动因为if条件需要第一个事件因为它之前的值时它不会触发。希望你明白我的意思，我怎样才能做好这项工作？

Answer 1

我想我理解你遇到的问题。您可以使用以下方式检查页面滚动的程度：

$(document).scrollTop();

如果它超过某个值，你决定可以调用你需要调用的函数，否则如果它在页面顶部加载，你的插件就会为你做。

停止事件并将变量设置为默认值

1 个答案: