Gibt es eine Möglichkeit, die Mausrad-Ereignisse (ohne über scroll
Ereignisse zu sprechen ) in jQuery abzurufen?
javascript
jquery
mousewheel
thejh
quelle
quelle
$(el).on('input', ...
Antworten:
Es gibt ein Plugin , das das Mausrad nach oben / unten und die Geschwindigkeit über eine Region erkennt.
quelle
quelle
DOMMouseScroll
Ereignis wird in FF verwendet, daher müssen Sie beide.bind('DOMMouseScroll mousewheel') {
evetns developer.mozilla.org/en-US/docs/DOM/DOM_event_reference/…e.originalEvent.wheelDelta
ist undefiniert in FF23Ich habe mich an beide gebunden
mousewheel
undDOMMouseScroll
am Ende sehr gut für mich gearbeitet:Diese Methode funktioniert in IE9 +, Chrome 33 und Firefox 27.
Bearbeiten - März 2016
Ich habe mich entschlossen, dieses Problem erneut zu behandeln, da es eine Weile her ist. Die MDN-Seite für das Bildlaufereignis bietet eine hervorragende Möglichkeit, die verwendete Bildlaufposition abzurufen
requestAnimationFrame
, was meiner vorherigen Erkennungsmethode sehr vorzuziehen ist. Ich habe ihren Code geändert, um neben Bildlaufrichtung und -position eine bessere Kompatibilität zu bieten:Dieser Code arbeitet derzeit in
Chrome v50, Firefox v44, Safari v9, and IE9+
Verweise:
quelle
Ab 2017 können Sie einfach schreiben
Funktioniert mit aktuellem Firefox 51, Chrome 56, IE9 +
quelle
Antworten, die über ein "Mausrad" -Ereignis sprechen, beziehen sich auf ein veraltetes Ereignis. Das Standardereignis ist einfach "Rad". Siehe https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel
quelle
wheel
EreignisEdge
nicht unterstützt,IE
was nicht dasselbe ist. CanIuseDas hat bei mir funktioniert :)
vom Stapelüberlauf
quelle
Hier ist eine Vanillelösung. Kann in jQuery verwendet werden, wenn das an die Funktion übergebene Ereignis das ist,
event.originalEvent
das jQuery als Eigenschaft des jQuery-Ereignisses zur Verfügung stellt. Oder wenncallback
wir innerhalb der Funktion unter vor der ersten Zeile hinzufügen :event = event.originalEvent;
.Dieser Code normalisiert die Radgeschwindigkeit / -menge und ist positiv für einen Vorwärtslauf bei einer typischen Maus und negativ für eine Rückwärtsbewegung des Mausrads.
Demo: http://jsfiddle.net/BXhzD/
Es gibt auch ein Plugin für jQuery, das ausführlicher im Code und etwas mehr Zucker ist: https://github.com/brandonaaron/jquery-mousewheel
quelle
Dies funktioniert in den neuesten Versionen von IE, Firefox und Chrome.
quelle
Ich steckte heute in dieser Ausgabe fest und stellte fest, dass dieser Code für mich gut funktioniert
quelle
Verwenden Sie diesen Code
quelle
Meine Kombination sieht so aus. Es wird bei jedem Bildlauf nach unten / oben ausgeblendet und eingeblendet. Andernfalls müssen Sie zum Header scrollen, um den Header einzufügen.
Das obige ist nicht für Touch / Mobile optimiert. Ich denke, dieses macht es besser für alle Handys:
quelle
Das Plugin , dass @DarinDimitrov geschrieben,
jquery-mousewheel
, mit jQuery 3+ gebrochen . Es ist ratsamer zu verwenden,jquery-wheel
was mit jQuery 3+ funktioniert.Wenn Sie nicht auf die jQuery-Route gehen möchten, rät MDN dringend dazu, das
mousewheel
Ereignis zu verwenden, da es nicht dem Standard entspricht und an vielen Stellen nicht unterstützt wird. Stattdessen heißt es, dass Sie daswheel
Ereignis verwenden sollten, da Sie viel genauer wissen, was die Werte bedeuten, die Sie erhalten. Es wird von den meisten gängigen Browsern unterstützt.quelle
Wenn Sie das erwähnte jquery-Mausrad-Plugin verwenden , verwenden Sie dann das zweite Argument der Event-Handler-Funktion
delta
:quelle
Ich habe vor kurzem das gleiche Problem bekommen, wo ich
$(window).mousewheel
zurückkamundefined
Was ich getan habe war
$(window).on('mousewheel', function() {});
Um es weiter zu verarbeiten, benutze ich:
quelle