Internet Explorer: в IE9 и IE10 вы должны использовать событие onwheel
(не onmousewheel и не DOMMouseScroll) с помощью addEventListener
, чтобы иметь возможность обнаруживать прокрутку горизонтального колеса из DOM. Используйте значение event.deltaX
вместе со значением event.deltaMode
для обнаружения горизонтального вращения мыши (для вертикального вращения используйте значение event.deltaY
). Для ‹= IE8 используйте событие onmousewheel
и event.wheelDelta
(для старых версий IE поддерживается только прокрутка мыши по оси Y).
Blink/Webkit: поддержка события onwheel, начиная с Chrome 31/Safari 7. В противном случае используйте событие onmousewheel
и свойства event.wheelDeltaX
и event.wheelDeltaY
. Трюк только для Chrome/Safari: использование клавиши SHIFT во время прокрутки мыши влево/вправо (полезно для тестирования).
Firefox: Firefox 17 и выше поддерживает событие onwheel а>. Для поддержки более старых версий Firefox (до 3.6) используйте устаревшее DOMMouseScroll
, а также свойства event.axis и event.detail для поддержки горизонтальной прокрутки. (Firefox Mobile: документы подразумевают, что событие onwheel будет срабатывать при панорамировании с помощью сенсорного устройства. Я не пробовал.). В Firefox также есть событие MozMousePixelScroll
. Документация MDN также дает рекомендуемый код для обработки различных событий в разных браузерах. Firefox также имеет конфигурацию mousewheel.enable_pixel_scrolling, которая может влиять на все различные события колеса.
Проверьте событие onwheel самостоятельно, используя тестер событий колеса от QuirksMode. Я видел, как это работает, используя IE9 в Win7 и IE10 в Windows 8 (предварительная версия, версия IE 10.0.8400.0). Чтобы настроить новое стандартное событие onwheel:
- Выберите радио addEventListener (захват).
- Отключить прокрутку.
- Отключить колесико мыши.
- Оставьте колесо включенным.
- Установите флажок Показать свойства события в нижней части правого столбца.
- Используйте F12 и убедитесь, что документ находится в стандартах documentMode IE9 или IE10 Standards.
- Проведите мышью по центральному столбцу и увидите, что события колесика регистрируются в левом столбце, а сведения о событиях колесика отображаются внизу правого столбца.
- Иногда вам может потребоваться снять и снова установить флажок события колеса, чтобы получить события (не знаю, почему: может быть, ошибка на странице quirksmode или в IE?)
спецификация W3C, документация Microsoft IE9 для события MouseWheel
и документы MDN укажите для события onwheel
:
deltaX
— Получает расстояние, на которое колесико мыши повернулось вокруг оси X (по горизонтали).
deltaY
— Получает расстояние, на которое колесико мыши повернулось вокруг оси Y (по вертикали).
deltaZ
— Получает расстояние, на которое колесико мыши повернулось вокруг оси Z.
deltaMode
- Gets a value that indicates the unit of measurement for delta values:
DOM_DELTA_PIXEL
(0x00) Default. The delta is measured in pixels.
DOM_DELTA_LINE
(0x01) Дельта измеряется в строках текста.
DOM_DELTA_PAGE
(0x02) Дельта измеряется в страницах текста.
Изменить: убедитесь, что вы НЕ предотвращаете событие Default(), если установлено event.ctrlKey
, иначе вы, вероятно, предотвратите масштабирование страницы. Также очевидно, что для ctrlKey установлено значение true, если вы используете масштабирование на сенсорной панели в Chrome и IE.
Обнаружение функций в IE затруднено:
- В IE10 с IE8 documentMode
'onwheel' in document
возвращает true, но кажется, что никакие события не запускаются для горизонтального или вертикального события onwheel.
- В IE9
'onwheel' in document
возвращает false, но событие onwheel работает (я думаю, что document.documentMode === 9
следует проверять перед использованием события onwheel в IE9).
- В IE9 и IE10 традиционный
document.onwheel = 'somefunc(event)'
не работает даже в documentMode 9 или 10 (т.е. похоже, что вы можете использовать только addEventListener).
Для тестирования используйте мышь Microsoft с наклонным колесом, сенсорную панель с прокруткой (жест или зону) или устройство Apple (волшебную мышь или мощный шарик прокрутки мыши). Поэкспериментируйте с различными настройками мыши или сенсорной панели в Windows (или настройками мыши в OSX при тестировании горизонтальной прокрутки в OSX с Safari).
Знаки значений дельты имеют противоположный знак для onwheel и onmousewheel для всех браузеров. Например, в IE значения дельты для onwheel и onmousewheel различны (используя мою машину разработчика с IE9 с очень стандартной мышью Microsoft):
event.deltaY
было 111 в Win8 или 72 в Win7 для события onwheel
, прокручивающегося на одну ступень вниз. Значение немного меняется при увеличении, но есть и другой фактор, который я не могу понять (похоже, это не размер шрифта).
event.wheelDelta
было -120 для события onmousewheel
, прокручиваемого на одну ступень вниз.
Для Windows XP «Мы должны добавить поддержку сообщения WM_MOUSEHWHEEL
, чтобы это работало [, поддержка] была добавлена в Vista, поэтому, если вы используете XP, вам необходимо установить IntelliType Pro и/или IntelliPoint» — согласно эту статью.
- Различные распространенные драйверы сенсорной панели и мыши нарушают поддержку колесика мыши для браузеров, например. неработающее обнаружение браузера или использование сообщений WM_HSCROLL и WM_VSCROLL вместо сообщений WM_MOUSEWHEEL и WM_MOUSEHWHEEL. Таким образом, драйверы не будут генерировать события колеса в браузере (независимо от того, какой браузер вы использовали или какую версию Windows вы использовали). поиск WM_VSCROLL в Bugzilla показывает проблемы, которые могут повлиять на любой браузер (не только на Firefox). ).
person
Community
schedule
12.10.2012