WheelEvent#
WheelEvent.deltaMode#
Właściwość deltaMode
zwraca liczbę całkowitą reprezentującą jednostkę pomiaru w układzie współrzędnych danego zdarzenia. Właściwość jest tylko do odczytu.
Składnia#
Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:
var unit = wheelEvent.deltaMode;
gdzie poszczególne człony oznaczają:
unit
- liczba całkowita reprezentująca jednostkę pomiaru w układzie współrzędnych. Dostępne są następujące możliwości:0
- wskazuje na piksele. Odpowiadająca stała toDOM_DELTA_PIXEL
.1
- wskazuje na linie. Odpowiadająca stała toDOM_DELTA_LINE
.2
- wskazuje na strony. Odpowiadająca stała toDOM_DELTA_PAGE
.
wheelEvent
- zdarzenie będące obiektem kontekstu.
Przy tworzeniu zdarzenia wartością domyślną dla właściwości deltaMode
musi być wartość 0
(stała DOM_DELTA_PIXEL
).
W czasie wysyłania zaufanych zdarzeń domyślna wartość przechowywana we właściwości deltaMode
będzie zależna od aplikacji klienckiej. Każda przeglądarka internetowa może przyjąć własne rozwiązania (Chrome i IE zwracają 0
, kiedy Firefox zwraca 1
).
W przypadku syntetycznych zdarzeń możemy samodzielnie ustawić wartość reprezentującą jednostkę pomiaru w układzie współrzędnych, np. w czasie tworzenia lub inicjowania zdarzenia.
Prosty przykład:
<!DOCTYPE html>
<html>
<head>
<style>
#box {width: 200px; height: 200px; overflow:auto;}
#box div {height: 2000px; background-color: #a08080;}
</style>
<script>
// Uruchom po całkowitym załadowaniu dokumentu
window.onload = function(){
var info = document.getElementById("info");
var box = document.getElementById("box");
function readInfo(e){
var data = "Interfejs: " + e
+ "<br>" + "e.type: " + e.type
+ "<br>" + "e.deltaX: " + e.deltaX
+ "<br>" + "e.deltaY: " + e.deltaY
+ "<br>" + "e.deltaZ: " + e.deltaZ
+ "<br>" + "e.deltaMode: " + e.deltaMode + "<br><br>";
info.innerHTML = data + info.innerHTML;
}
box.addEventListener("wheel", readInfo, false);
}
</script>
</head>
<body>
<p>Obracaj kółko myszy w obrębie kontenera by odczytać poszczególne cechy zdarzenia.</p>
<div id="box">
<div></div>
</div>
<p style="color: blue;">Szczegółowe informacje dla przechwyconego zdarzenia:</p>
<p id="info"></p>
</body>
</html>
Interfejs Web IDL#
readonly attribute unsigned long deltaMode;