Question

我试图触发这个插件，只在滚动一次时可见。

// Fun Facts Counter

    $(window).scroll(function() {

        var bh = $(window).height();
        var st = $(window).scrollTop();
        var el = $('.timer');
        var eh = el.height();
        if ( st >= (100 + eh) - bh ) {
            el.countTo({
                speed: 2000,
                refreshInterval: 20
            });
        }

    });

问题是，我还在导航栏上滚动到顶部。

$(window).scroll(function(){
        if ($(this).scrollTop() > $(window).height()) {
            $('.navbar').addClass('fixed');
            $('body').css('padding-top', '97px');
        } else {
            $('.navbar').removeClass('fixed');
            $('body').css('padding-top', '0');
        }
    });

所以当我尝试使用.on和.off时，两个元素都停止了工作。如何只让第一个插件点火一次？请帮忙。

Answer 1

以下内容将仅启动第一个插件函数：

   var flag = 0;

    $(document).scroll(function() {
       if($(this).scrollTop() >= $(this).height() - 200){
           if (flag == 1){
              return false;
           }
           else{
              var bh = $(window).height();
              var st = $(window).scrollTop();
              var el = $('.timer');
              var eh = el.height();
              if ( st >= (100 + eh) - bh ) {
                  el.countTo({
                      speed: 2000,
                      refreshInterval: 20
                  });
              }
              flag = 1;
           }
       }
    });

jQuery滚动 - 只触发一次插件

1 个答案: