Jquery fade div inページの先頭に到達しました

Question

こんにちは私は、ユーザーが垂直方向ではなく水平方向にスクロールできるWebサイトを持っています。 右にある右矢印をスクロールしたりクリックしたりすると、白い背景のまま残っているdivがありますが、ページの先頭に達することなく左にスクロールすると背景がフェードインします。

ユーザーがページの先頭に移動したときにdiv（＃bgvid）が消えるのを助ける必要があります。

これは私の現在のコード

$(document).ready(function() { 
var distance = $('#bgvid').offset().left; 
    var left = $(window).scrollLeft(); 


    var $item2 = $('div.inner-group-container'), //Cache your DOM selector 
    visible2 = 1, //Set the number of items that will be visible 
    index2 = 0, //Starting index 
    endIndex2 = ($item2.length); //End index 
    var w = $("div.inner-group-container").width(); 

$('#arrowR').click(function(){ 
     index2++; 
     $item2.animate({ scrollLeft: '+=' + w + 'px'}, 800); 
     $("#bgvid").fadeOut(); 
}); 


$('#arrowL').click(function(){ 
    if(index2 > 0){ 
     index2--; 
     $item2.animate({ scrollLeft: '-=' + w + 'px'}, 800); 
    } 


    if (left >= distance) { 
     $("#bgvid").fadeIn(); 
    } 


}); 



$(window).bind('mousewheel', function(event) { 
    var scroller = $('body').scrollLeft(); 


    if (event.originalEvent.wheelDelta >= 0) { 

     console.log(distance); 
     console.log(scroller); 

     if (scroller == distance) { 
      $("#bgvid").fadeIn(); 
     } 


     if(index2 > 0){ 
     index2--;    
     $item2.animate({ scrollLeft: '-=' + w + 'px'}, 800); 
     } 

     }else { 
      $item2.animate({ scrollLeft: '+=' + w + 'px'}, 800); 
      index2++; 
      $("#bgvid").fadeOut(); 

     } 
}); 



}); 

Answer 1

答えがここにあります： Detect end of horizontal scrolling div with jQuery

if ($(document).scrollTop() == ($(document).height() - $(window).height()) { 
    // Do something here ... 
}