Vor nicht allzu langer Zeit wollte ich den Effekt des Hochschiebens der Schultasche im Taobao- und QQ-Bereich nachahmen, um ein Dropdown-Menü anzuzeigen, aber ich habe festgestellt, dass unter IE6 der Mouseover immer wieder startet Bewegen der Maus innerhalb des divEvent, ich habe mich gefragt, ich habe diesen Artikel im Internet gefunden, er wird tatsächlich in der API erklärt, aber ich habe ihn nicht gesehen, ich glaube Freunde, die das gleiche Problem haben Ich werde nach dem Lesen dieses Artikels inspiriert sein
Früher dachte ich, dass in jquery die Mouseover- und Mouseout-Ereignisse tatsächlich dem Hover-Ereignis entsprechen. Es gibt keinen Unterschied zwischen den beiden, sie sollten gleich sein. Aber gestern hat mir ein Animationseffekt klar gemacht, dass die beiden nicht gleichwertig sind.
<div class="wrapper"> < div class="img"></div> < div class="text"></div> < /div> < div class="point"></div>
Fügen Sie ein Ereignis zum Wrapper hinzu. Wenn sich die Maus zum Wrapper bewegt, wird die Ebene mit class="point" vergrößert. Wenn Sie jedoch Mouseover- und Mouseout-Ereignisse verwenden, wird die Punktebene größer oder kleiner, wenn Sie sich zwischen der Bild- und der Textebene bewegen . Gestoppte Änderungen. Dies ist nicht das gewünschte Ergebnis. Solange sich die Maus auf der Wrapper-Ebene befindet,
ob img oder text, wird der Punkt größer, aber wenn sich die Maus nicht aus der Wrapper-Ebene bewegt hat Wrapper-Schicht, die Punktschicht wird nicht kleiner.
Langsam wurde uns die Idee klar, indem wir Hover anstelle von Mouseover und Mouseout verwendeten.
Es ist wirklich übertrieben, dass wir lange gebraucht haben, um ein so einfaches Problem zu lösen. Schreiben Sie als Andenken ein Tagebuch.
Ergänzung: Später sagte mein Meister, dass es tatsächlich einen solchen Absatz im JQuery-Quellcode gibt:
hover: function( fnOver, fnOut ) {
return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
}Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen den jQuery-Ereignissen Mouseover, Mouseout und Hover. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
