FullPageJS предотвращает сенсорную прокрутку в меню гамбургера; как интегрировать?

#css #wordpress #fullpage.js #hamburger-menu

Вопрос:

У меня есть веб-сайт, использующий фантастический плагин fullPageJS, и он делает то, что делает, очень, очень хорошо.

Однако у меня есть проблема на мобильных устройствах, когда скользящее меню гамбургеров не прокручивается с помощью сенсорного управления, когда высота меню превышает высоту окна просмотра, как на этом рисунке:

Вопрос

Как мне заставить боковое меню принимать сенсорную прокрутку?

Ответ №1:

Вы должны использовать fullpage.js вызвана опция normalScrollElements .

Как подробно описано в fullpage.js документы:

normalScrollElements: (по умолчанию null ) Если вы хотите избежать автоматической прокрутки при прокрутке некоторых элементов, вам нужно использовать эту опцию. (полезно для карт, прокрутки разделов и т.д.) Для этих элементов требуется строка с селекторами Javascript. (Например: normalScrollElements: '#element1, .element2' ). Эта опция не должна применяться к какому-либо самому элементу раздела / слайда.

Кроме того, вы можете вызвать fullpage_api.setAllowScrolling(false) при открытии модального. Это предотвратит fullpage.js для прокрутки вверх или вниз при использовании колеса мыши или трекпада.

Вы можете вернуть ему значение по умолчанию при закрытии меню с помощью fullpage_api.setAllowScrolling(true) .

1. Подождите — вы автор плагина? Почему, большое вам спасибо, что пришли на помощь!

2. Да! Это я!

3. Поскольку вы здесь, мне любопытно — какой CSS регулирует возможность прокрутки с помощью сенсорных функций мобильного устройства? Я пытался изменить свойства элемента самостоятельно, но безрезультатно.

Ответ №2:

Вам следует попробовать добавить overflow: scroll , если вы еще этого не сделали.

1. Первое, что я попробовал, конечно; и это уже было. Это не так просто — это действительно прокручивается колесом мыши, но не с помощью прокрутки, имитируемой касанием.

2. вы проверили z-индекс?

3. Это тоже. Я перепробовал все базовые вещи — это работает с обычной прокруткой, просто не с сенсорной.

4. это не работает в safari и Chrome на мобильных устройствах? оба?

5. github.com/alvarotrigo/fullPage.js/issues/2964 взгляните сюда!