섹션의 가로 스크롤을 중지하고 페이지 세로 스크롤을 시작합니다.

Question

내 사이트 페이지에 가로 스크롤이 있고 전체 페이지에 세로 스크롤이있는 div가 있습니다. 특정 섹션에 포인터가 있으면 페이지의 세로 스크롤이 중지되고 섹션이 시작됩니다 가로 스크롤. 나는 이것을 위해 함수를 사용했다. 어떻게 해당 섹션의 가로 스크롤이 끝날 때 섹션 스크롤 닫기 및 웹 페이지 스크롤 시작되도록 해당 함수를 설정할 수 있습니다. 어떻게해야합니까? 나는 부분의 수평 스크롤을 위해 다음 함수를 사용했다 : -

(function() { 
    function scrollHorizontally(e) { 
     e = window.event || e; 
     var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail))); 
     document.getElementById('myDIV').scrollLeft -= (delta*40); // Multiplied by 40 
     e.preventDefault(); 
    } 
    if (document.getElementById('myDIV').addEventListener) { 
     // IE9, Chrome, Safari, Opera 
     document.getElementById('myDIV').addEventListener("mousewheel", scrollHorizontally, false); 
     // Firefox 
     document.getElementById('myDIV').addEventListener("DOMMouseScroll", scrollHorizontally, false); 
    } else { 
     // IE 6/7/8 
     document.getElementById('myDIV').attachEvent("onmousewheel", scrollHorizontally); 
    } 
})(); 

Answer 1

수평 스크롤 사업부의 폭을 측정하고 jQuery's .scrollLeft()를 사용하여 가로 스크롤 거리를 비교합니다. div의 너비를 스크롤 거리에 추가해야합니다. 두 항목이 동일하면 스크롤이 div의 끝까지 도달했습니다. 이 시점에서 스크롤 기능에서 계속 확인되어야하는 플래그를 설정하십시오. 플래그는 div가 스크롤해야하는지 페이지인지를 결정할 수 있습니다.

Answer 2

$(window).scroll(function() { 


    if($("#yourdiv").scrollLeft() + $(window).width() == $("#yourdiv").width()) { 
    Your code here 
    } 
}); 

div가 창보다 큰 경우에만 작동합니다. 그렇지 않으면 $ ("# mycontainer")로 $ (window) .width()를 변경해야합니다. width 거의 비슷한 경우에 나를 위해 일했던 희망이지만, 내 페이지가 어떻게 보이는지 모르겠습니다. 처럼.