Onscroll для div

Не имеет ли элемент div onscroll обработчик событий? Поведение на моей странице, похоже, не указывает, что распознаватель событий div onscroll распознается.

<div id='bd' onscroll='alert("Scroll Called");'></div>

Кроме того,
Делают ли события прокрутки div свертываются до событий прокрутки окна, как в случае события DOM?

Ответы

Ответ 1

В зависимости от используемой версии HTML вы можете использовать событие onwheel.

Событие onscroll работает только в том случае, если выполняется следующее:

  • div имеет overflow: auto, overflow: scroll, overflow-y: scroll и т.д.
  • В настоящее время у div есть видимая полоса прокрутки, которая может прокручиваться.
  • Движение мыши фактически вызывает прокрутку полосы прокрутки.

Итак, событие onscroll не подходит для обнаружения общего движения колесика мыши.

Обратите внимание, что событие onwheel является новым в HTML 5. Согласно w3schools, он довольно широко поддерживается.

Ответ 2

Я тоже почесал голову над этим, пока не начал больше узнавать о директивах DOCTYPE. Атрибут onscroll не поддерживается в последней версии спецификации HTML. Он будет отображаться как недействительный синтаксис в Visual Studio. Он может работать во многих браузерах, но он все еще недействителен.

Вместо этого вы можете использовать событие canan с помощью Javascript или jQuery. Я использую такой подход, чтобы синхронизировать прокрутку на двух отдельных div:

$("#gridTableContainer").scroll(function() {
    HandlingScrollingStuff();
});

Ответ 3

Да, но элемент должен иметь полосу прокрутки. Вы можете указать его с помощью overflow: auto (который дает вам полосу прокрутки, когда контент достаточно высок) или overflow: scroll. (Они могут быть заданы специально для x и y также overflow-y: scroll...)

Хотя они не пузырятся, когда div прокручивается донизу, окно начнет прокрутку. (В принципе, если div может прокручивать, он перехватит событие прокрутки, но если он не сможет, он перейдет на страницу)

Ответ 4

Я знаю, что это может быть не совсем то, что вы ищете, но многие фреймворки javascript могут помочь вам в этом. Нет необходимости, чтобы у div была панель прокрутки, чтобы вы могли подключаться к событиям прокрутки.

Eg. Mootools имеет событие mousewheel. Демо здесь. (У него есть полосы прокрутки, но вы можете использовать Firebug для удаления полос прокрутки и попробовать - он все равно работает).

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

Ответ 5

JQUERY scroll() может помочь вам.

$("#gridTableContainer").scroll(function() {
    HandlingScrollingStuff();
});