如何啟用和禁用頁面滾動

Question

我的項目僅是水平滾動。 意思是X。

#landscape是整個容器。

首先，我禁用#landscape的滾動。

之后，當我單擊.close-reveal-modal ， div淡入。

在這個div我仍然無法滾動$('#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