Как отключить прокрутку страницы в FF с помощью клавиш со стрелками - PullRequest
3 голосов
/ 07 января 2010

Я строю меню из тем и предметов. Каждую тему можно развернуть и свернуть, нажав на нее. Моя задача - сделать так, чтобы с помощью клавиш со стрелками вверх и вниз можно было перемещаться по темам и пунктам меню. Я уже сделал это, но проблема в том, что когда страница больше, чем окно, страница прокручивается при нажатии клавиш со стрелками. Я пытался использовать:

document.body.style.overflow = "hidden";

, чтобы остановить прокрутку страницы. Так, например, когда я нажимаю «Topic2», я могу продолжать использовать клавиши со стрелками для перехода к следующей теме / элементу. После этого, если я щелкну где-нибудь еще на экране, я верну переполнение в автоматический режим, и страницу можно будет снова прокрутить.

Это работает в IE, но не в FF. В FF полосы прокрутки удаляются, и колесо мыши не прокручивает страницу, но клавиши со стрелками по-прежнему работают. Итак, мой вопрос, как это исправить, или лучше, как не прокручивать страницу, когда фокус находится на каком-либо элементе меню? Таким образом, я не буду использовать свойство переполнения.

Ответы [ 3 ]

12 голосов
/ 07 января 2010

Необходимо привязать событие нажатия клавиши к документу, и, если код клавиши события соответствует любой из клавиш со стрелками (37–40), вернуть false.Таким образом, нажатие стрелки не пойдет дальше.

document.onkeydown = function(e) {
    var k = e.keyCode;
    if(k >= 37 && k <= 40) {
        return false;
    }
}

Вы можете легко расширить это, чтобы работать, только когда ваше меню активно, но, не видя некоторый его код, невозможно дать вампример.

2 голосов
/ 23 августа 2012

ниже код исправил проблему

$(window).scroll(function () { 
  window.scrollTo(0,0);
});
0 голосов
/ 07 января 2010

Единственный способ, которым я могу видеть, - это перехватить событие keydown и выполнить размытие / фокусировку самостоятельно.

Кажется, есть некоторые ошибки с перехватом этих ключей, см. в этом вопросе для ряда (основанных на JQuery) примеров, которые выглядят довольно многообещающими.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...