2016-09-19 3 views
0

私はこのような複数のスクロール機能があります。すべてのスクロール機能を組み合わせる(収集する)方法はありますか?

FIRSTを

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

SECOND

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

THIRD私はこの方法を試してみました

$(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の関数として機能していない複数のスクロール機能の

を働かない、私はどのように健康的なだけで1つの関数にすべて window.scroll機能を組み合わせるためにということだろう理由です期待?

答えて

0

コードにいくつかの問題があります。まず、関数をスクロール関数内に宣言することです。これはパフォーマンス上問題ありません。 2番目の関数は関数内で使用している$(this)です。私は "これ"が何であるか分からない。あなたが使用しているその文脈では、これはウィンドウオブジェクトになりますが、私はそれがあなたが必要とするものではないと思います。ここで詳しい情報が必要です。

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; 
    } 
}); 
関連する問題