ページスクロールを有効または無効にする方法

Question

プロジェクトは水平スクロールのみです。その意味は、X.

#landscapeです。

まず、#landscapeのスクロールを無効にします。私はこのdivで。

にdivフェード.close-reveal-modalをクリックしたとき、私はまだ$('#landscape')をスクロールすることはできません。その後

。 その後、.close-reveal-modalを閉じた後に$('#landscape')のスクロールを有効にしたいとします。

私は$('#landscape').offを意味することに疲れています。しかし、それは私のためには機能しません。

$('#landscape').on('scroll touchmove mousewheel', function(e){ // on off means enable and disable 
    e.preventDefault(); 
    e.stopPropagation(); 
    return false; 
}) 

$('.close-reveal-modal').click(function(){ 
    setTimeout(function(){ 
     $('#second_load').fadeIn(300); 
    }, 1000); 
}); 

$('#second_load').click(function(){ 
    $('#second_load').fadeOut(300); 

    $('#landscape').off('scroll touchmove mousewheel', function(e){ // on off means enable and disable 
     e.preventDefault(); 
     e.stopPropagation(); 
     return false; 
    }) 
}); 

Answer 1

function freeze() { 
     var top = $("html").scrollTop() ? $("html").scrollTop() : $("body").scrollTop(); 
     var left = $("html").scrollLeft() ? $("html").scrollLeft() : $("body").scrollLeft(); 
     if(window.innerWidth > document.documentElement.clientWidth) { 
      $("html").css("overflow-y", "scroll"); 
     } 
     if(window.innerHeight > document.documentElement.clientHeight) { 
      $("html").css("overflow-x", "scroll"); 
     } 
     $("html").css({"width": "100%", "height": "100%", "position": "fixed", "top": -top, "left": -left}); 
} 
function unfreeze() { 
     $("html").css("position", "static"); 
     $("html, body").scrollTop(-parseInt($("html").css("top"))); 
     $("html, body").scrollLeft(-parseInt($("html").css("left"))); 
     $("html").css({"position": "", "width": "", "height": "", "top": "", "left": "", "overflow-y": "", "overflow-x": ""}); 
} 

出典：https://github.com/HubSpot/vex/issues/155