Как предотвратить прокрутку мыши за пределами зависшего элемента?

У меня есть div, для которого установлено значение overflow:scroll;. Я получаю полосы прокрутки, чего я и хочу. Однако при прокрутке div с помощью колесика мыши он прокручивает остальную часть страницы, когда достигает верхней или нижней части содержимого div.

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


javascript scroll html css hover
person Sakaa    schedule 04.06.2010    source источник

Ответы (3)


arrow_upward
1
arrow_downward

Во-первых, я не думаю, что вы можете переопределить событие прокрутки. Итак, вот что я бы сделал. Я не знаю jquery, но вот какой-то прямой javascript.

document.getElementById('scrollDiv').onmouseover=function(){
  document.getElementByTagName('body')[0].style.overflow='hidden';
}
document.getElementById('scrollDiv').onmouseout=function(){
  document.getElementByTagName('body')[0].style.overflow='';
}

Очевидно, вы можете немного изменить это, но это основная идея. Кроме того, если вам нужно, вы можете выполнить другие тестовые случаи. Например, если у div есть фокус, сделайте то же самое. Зависит от вашей настройки.

person qw3n    schedule 05.07.2010
comment
проблема с overflow: hidden заключается в том, что он обычно возвращает прокрутку страниц вверх, что может сбивать с толку. почему бы не иметь прослушиватель onscroll, который фиксирует высоту прокрутки страницы? - person stefan; 15.05.2014

arrow_upward
1
arrow_downward

Вы можете проверить положение мыши и отменить события прокрутки для документа, если мышь находится в пределах границ div.

person BC.    schedule 04.06.2010
comment
Звучит здорово, спасибо, но как мне это сделать? Не могли бы вы написать пример кода jquery? - person Sakaa; 05.06.2010

arrow_upward
0
arrow_downward

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

person manalang    schedule 04.06.2010