Das Ereignis onmousewheel des Skripts, das ausgeführt wird, wenn das Mausrad in HTML5 gescrollt wird

Das

wheel-Ereignis unterscheidet sich geringfügig in verschiedenen Browsern. Einer wie Firefox verwendet auch die Methode addEventListener, um das DomMouseScroll-Ereignis zu binden . Lassen Sie mich Ihnen eine detaillierte Einführung geben.

Firefox verwendet DOMMouseScroll und andere Browser verwenden das Mausrad. Wenn ein Scroll-Ereignis ausgelöst wird, verwendet Firefox das Detail--Attribut , um die Radinformationen zu erfassen, und andere Browser verwenden WheelDelta. Ich weiß nicht, warum andere Hersteller in dieser Frage so konsequent mit Microsoft übereinstimmen. Firefox kann die Methode addEventListener verwenden, um das DomMouseScroll-Ereignis zu binden.

elem.addEventListener('DOMMouseScroll', func, false); IE und andere Mainstream-Browser können das traditionelle Ereignis-Bindungsmodell verwenden. Verwenden Sie jedoch nicht die proprietäre attachmentEvent-Methode des IE. Andere Mainstream-Browser erkennen die Methode von Microsoft nicht.

Das Scrollen mit dem Firefox-Mausrad nach oben beträgt -3, das Scrollen nach unten beträgt 3.

Das Scrollen mit dem IE-Mausrad nach oben beträgt 120, das Scrollen nach unten beträgt -120.

Das Scrollen mit dem Safari-Mausrad nach oben beträgt 360, nach unten scrollen ist -360

Opera-Mausrad nach oben scrollen ist 120, nach unten scrollen ist -120

Chrome-Mausrad nach oben scrollen ist 120, nach unten scrollen ist -120

Jemand hat einige Tests unter Safari durchgeführt: „Wenn Sie nur einmal scrollen, beträgt der Wert +-0,1. Wenn Sie etwas schneller scrollen (mehrmals scrollen), wird dieser Wert ebenfalls größer. Das liegt daran, dass es eine Maus gibt.“ Radbeschleunigungsfunktion unter Mac OS. Wenn Sie einmal scrollen, scrollt der Browser um 1 Pixel, und wenn Sie dreimal scrollen, scrollt der Browser um 30 Pixel.“ Gleichzeitig forschte er auch an Camino (einer auf Gecko basierenden Kernel-Engine): „Ähnlich wie Safari (+- 0,3 bis +-Infinity), obwohl es dieselbe Kernel-Engine wie Firefox verwendet, beträgt der Delta-Wert nur +.“ -2.666666 Floating, unabhängig von der Scrollgeschwindigkeit

Nach meinem Test sind IE/Opera vom gleichen Typ und Sie können attachmentEvent verwenden, um das Wheel-Ereignis hinzuzufügen

/*IE注册事件*/ 
if(document.attachEvent){  
  document.attachEvent('onmousewheel',scrollFunc);  
}

Firefox. addEventListener fügt Scrollrad-Ereignisse hinzu

/*Firefox注册事件*/ 
if(document.addEventListener){  
  document.addEventListener('DOMMouseScroll',scrollFunc,false);  
}

Safari und Chrome sind vom gleichen Typ und Ereignisse können mit HTML DOM hinzugefügt werden

window.onmousewheel=document .onmousewheel=scrollFunc;//IE/Opera/Chrome

Außer Firefox können alle anderen HTML-DOM zum Hinzufügen von Ereignissen verwenden, also fügen Sie Ereignisse mit der folgenden Methode hinzu

/*注册事件*/ 
if(document.addEventListener){  
  document.addEventListener('DOMMouseScroll',scrollFunc,false);  
}//W3C  
window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome

Das obige ist der detaillierte Inhalt vonDas Ereignis onmousewheel des Skripts, das ausgeführt wird, wenn das Mausrad in HTML5 gescrollt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!