Как убрать скролл браузера при открытии меню, а после закрытия обратно его включить?

265

08 июля 2017, 11:43

Как убрать скролл браузера при открытии меню, а после его закрытия обратно его включить? Нашел вот такое решение, но не знаю как выключить это после того, как закроется меню:

document.onmousewheel = document.onwheel = function () {
  return false;
};
document.addEventListener("MozMousePixelScroll", function () {
  return false
}, false);
document.onkeydown = function (e) {
  if (e.keyCode >= 33 && e.keyCode <= 40) return false;
};
return false;

Вот ссылка на кодпен

P.S. overflow: hidden; не подходит, т.к. после отмены этого свойства будет скроллиться в самый верх страницы.

Answer 1

Вынесите определение нужно скроллить или нет во внешнюю переменную и в ваших ф-ях возвращайте ее:

 window.can_scroll = true;
 document.onmousewheel = document.onwheel = function () {
    return window.can_scroll;
 };
 document.addEventListener("MozMousePixelScroll", function () {
    return window.can_scroll
 }, false);
 document.onkeydown = function (e) {
    if (e.keyCode >= 33 && e.keyCode <= 40) return window.can_scroll;
 };

Или удаляйте листенеры:

 // выключить скролл
 document.onmousewheel = document.onwheel = function () {
    return false;
 }; 
 function scrollOrNot() {
     return false;
 }
 document.addEventListener("MozMousePixelScroll", scrollOrNot, false);
 document.onkeydown = function (e) {
    if (e.keyCode >= 33 && e.keyCode <= 40) return window.can_scroll;
 };
 // включить скролл
 document.onmousewheel = document.onwheel = function () {
    return true;
 }; 
 document.onkeydown = function (e) {
    return true;
 };
 document.removeEventListener("MozMousePixelScroll", scrollOrNot, false);