Дано:
Раскрытое меню, взятое
отсюда (уменьшите экран, для понимая вопроса).
Слева остаётся контентная зона. Но если высота сайта будет больше чем заданная в примере, то при открытом меню можно будет левую часть, тоже скроллить.
Надо: чтобы левую (контентную зону) скроллить было нельзя.
Как не получалось:
На просторах интернета находил такой код:
position: fixed;
overflow: hidden;
Но он просто "СТОПарит" нужную зону, и не даёт двигаться, ПРИ ЭТОМ возвращая в начало экрана.
То есть, если мы даже прокрутим страницу вниз, и нажмём открыть меню, то вернёмся вверх.
До нажатия
После нажатия
Как видите, возвращает обратно наверх. Как этого избежать?
----
UPD. Нашёл такой
линк.
Там есть код:
var prevent = function(event) {
window.scrollTo(0, 0);
event ? event.preventDefault() : window.event.returnValue = false;
};
if(window.addEventListener) {
var array = ['DOMMouseScroll', 'mousewheel', 'scroll'],
i = array.length;
while(i--) {
window.addEventListener(array[i], prevent, false);
}
}
else window.onmousewheel = document.onmousewheel = window.onscroll = prevent;
Вроде сработало, но оно сработало на весь класс контента.
У меня есть контент зона .cd-main-content.
И она же когда раскрытое меню .cd-main-content.nav-is-visible.
И я понимаю, что сюда
var array = ['DOMMouseScroll', 'mousewheel', 'scroll'],
вместо scroll надо впихнуть .cd-main-content.nav-is-visible, а как впихнуть двойной класс?
----
UPD. нашёл
вариант, почему в последнем моём примере не двигается контентная зона?
