有什么办法可以合并(收集)所有滚动功能? [英] is there any way to combine(collect) all scroll functions?

问题描述

我有一个以上的滚动功能:

I have more than one scroll function like this:

第一

  $(document).scroll(function(){
        if(!$(".hotel-search-box").length){
            return false;
        }
        var y = $(this).scrollTop();
          if (y > $(".hotel-search-box").offset().top) {
            $('.sticky-checkin').show();
          } else {
            $('.sticky-checkin').hide();
          }
    });

第二

   $(document).scroll(function() {
      if (!$("#aniStickyNav").length) {
     return false; //Check if the element exist
  }
  var y = $(this).scrollTop();
  if (y > $(".after-scroll-sticky").offset().top+$(".hotel-search-box").height()) {
    $('#aniStickyNav').show();
  } else {
    $('#aniStickyNav').hide();
  }
});

第三

$(window).on('scroll', function () {
    backToTop();
});

我尝试过这种方式

$(window).scroll(function(){
       function siziArayalim(){
           var y = $(this).scrollTop();
      if (y > 800) {
        $('.sizi-arayalim').fadeIn();
      } else {
        $('.sizi-arayalim').fadeOut();
      }
    }
 function aniStickyNav(){
         if (!$("#aniStickyNav").length) {
            return false; //Check if the element exist
        }
      var y = $(this).scrollTop();
      if (y > $(".after-scroll-sticky").offset().top+$(".hotel-search-box").height()) {
        $('#aniStickyNav').show();
      } else {
        $('#aniStickyNav').hide();
      }
    }

function stickyCheckin(){
     if(!$(".hotel-search-box").length){
        return false;
    }
    var y = $(this).scrollTop();
      if (y > $(".hotel-search-box").offset().top) {
        $('.sticky-checkin').show();
      } else {
        $('.sticky-checkin').hide();
      }
}
  siziArayalim();
  aniStickyNav();
  stickyCheckin();
});

但没有任何作用

并且由于多个滚动功能，某些js函数无法按预期运行，这就是为什么我想知道如何将所有window.scroll函数组合为一个功能正常的函数?

and because of more than one scroll function some js functions is not working as expected that is why I wonder that how to combine all window.scroll function in a just one function healthy ?

推荐答案

您的代码存在一些问题，第一个问题是您在scroll函数中声明了函数.这对于性能而言是不正确的.第二个是您在函数内部使用的$(this).我不知道这个"是什么.在这种情况下，您将使用window对象，但我认为这不是您所需要的.在这里需要更多信息.

There are some issues with your code, first one is that you declare your functions inside the scroll function. This is not OK for performance. The second one is $(this) you are using inside the functions. I don't know what "this" is. In that context you are using, this will be the window object but i don't think that's what you need. Need more info here.

function siziArayalim(){
    var y = $(this).scrollTop();
    if (y > 800) {
        $('.sizi-arayalim').fadeIn();
    } else {
        $('.sizi-arayalim').fadeOut();
    }
}

function aniStickyNav(){
    if (!$("#aniStickyNav").length) {
        return false; //Check if the element exist
    }
    var y = $(this).scrollTop();
    if (y > $(".after-scroll-sticky").offset().top+$(".hotel-search-box").height()) {
        $('#aniStickyNav').show();
    } else {
        $('#aniStickyNav').hide();
    }

    return true;
}


function stickyCheckin(){
    if(!$(".hotel-search-box").length){
        return false;
    }
    var y = $(this).scrollTop();
    if (y > $(".hotel-search-box").offset().top) {
        $('.sticky-checkin').show();
    } else {
        $('.sticky-checkin').hide();
    }

    return true;
}


$(window).scroll(function(){
    siziArayalim();

    // check if the functions return false, if not, continue
    if(!aniStickyNav()){
        return false;
    }

    if(!stickyCheckin()){
        return false;
    }
});

这篇关于有什么办法可以合并(收集)所有滚动功能?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！