Метод setKeyboardScrolling

Метод setKeyboardScrolling является важным инструментом управления поведением клавиатурной навигации на сайте, реализованном с использованием библиотеки fullPage.js. Он позволяет динамически включать или отключать возможность прокрутки страниц с помощью клавиш клавиатуры, таких как стрелки вверх/вниз, Page Up/Page Down, пробел и другие стандартные комбинации.

Синтаксис метода

fullpage_api.setKeyboardScrolling(boolean, directions);

Параметры:

  1. boolean — true или false.

    • true — включает возможность управления прокруткой с клавиатуры.
    • false — полностью блокирует управление с клавиатуры.

  2. directions — необязательный параметр, массив строк, указывающий направления, по которым будет работать прокрутка:

    ['up', 'down', 'left', 'right']
    • Если параметр не указан, клавиатурная навигация будет включена во всех направлениях, которые поддерживает текущая конфигурация fullPage.js.

Примеры использования

1. Отключение клавиатурной прокрутки полностью:

fullpage_api.setKeyboardScrolling(false);

После выполнения этой команды стрелки клавиатуры и другие горячие клавиши перестанут переключать секции.

2. Включение клавиатурной прокрутки только по вертикали:

fullpage_api.setKeyboardScrolling(true, ['up', 'down']);

При этом горизонтальная прокрутка с клавиатуры (left, right) останется заблокированной.

3. Отключение прокрутки при модальных окнах:

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

function openModal() {
    fullpage_api.setKeyboardScrolling(false);
    document.querySelector('.modal').style.display = 'block';
}

function closeModal() {
    document.querySelector('.modal').style.display = 'none';
    fullpage_api.setKeyboardScrolling(true);
}

Такой подход предотвращает случайное переключение секций при взаимодействии пользователя с модальным контентом.

Особенности и нюансы

  • Метод доступен только после инициализации fullPage.js, то есть после вызова new fullpage('#fullpage', {...}).
  • При динамическом включении или отключении клавиатуры сразу изменяется поведение всех текущих и будущих секций.
  • Если используется инерционная прокрутка, отключение клавиатуры не отменяет автоматическую прокрутку по тач-событиям или колесу мыши — метод контролирует исключительно клавиатурные события.
  • Поддерживается комбинация с параметром autoScrolling: true/false. Если автопрокрутка выключена, клавиатура может управлять страницей стандартным скроллом браузера, но fullPage.js перестанет «перехватывать» события.

Практические советы

  1. Тестировать на мобильных устройствах, так как многие смартфоны и планшеты не имеют полноценной клавиатуры, а поведение метода там отличается.
  2. Использовать совместно с setAllowScrolling, если требуется более тонкая настройка прокрутки мышью и сенсорными экранами. Например, можно отключить клавиатуру, но оставить колесо мыши активным.
  3. Комбинировать с событиями fullPage.js, например onLeave или afterLoad, чтобы динамически блокировать клавиатурные стрелки в зависимости от текущей секции.

Выводы по использованию

  • setKeyboardScrolling обеспечивает гибкий контроль над клавиатурной навигацией в fullPage.js.
  • Позволяет реализовать сценарии, где часть интерфейса требует блокировки клавиатуры (модальные окна, интерактивные формы, анимации секций).
  • Используется как динамический инструмент, изменяющий поведение сайта в реальном времени без необходимости перезагружать fullPage.js или страницу.
Оглавление