Wenn ein Element ein anderes Element enthält, das über ein CSS animiert wird, klicken Sie auf Ereignisse, die gelegentlich nicht ausgelöst werden.Browser ignoriert manchmal ein jQuery-Klickereignis während einer CSS3-Transformation
Testfall: http://codepen.io/anon/pen/gbosy
Ich habe ein Layout, in dem eine Reihe von Bildern Beschriftungen hat, die auf schweben aufgedeckt werden. Beim Anklicken feuern sie einen .slideDown eines benachbarten Elements ab. Sie selbst werden wahrscheinlich von einem Benutzer schnell durchgeblättert. Das Problem ist auf einer Live-Site noch deutlicher als im Codepen.
Im Codepen werden ungefähr 90% meiner Klicks befolgt, während wenn CSS-Übergänge deaktiviert sind, werden 100% befolgt.
Alle Vorschläge sind willkommen.
Ich sollte beachten, dass das Problem am einfachsten in Chrome zu replizieren ist, wobei es in Safari weniger üblich und in Firefox wesentlich seltener ist.
, dass eine Behandlung funktioniert. Danke, ich war mir dieser CSS-Eigenschaft gar nicht bewusst. Mein einziges Problem ist, dass es überhaupt nicht auf IE unterstützt wird: https://developer.mozilla.org/en/docs/CSS/pointer-events Sind Sie sich bewusst, welche Möglichkeiten, dies zu tun, die weiter unterstützt werden? –
@Magnakai Was mich fasziniert ist, dass, wenn ich die Links austauschbar wirklich schnell anklicke, der prevent-default-Aufruf fehlschlägt und der Link ausgeführt wird (die URL wird geladen). Ich bin nicht sicher, warum das passiert. –
das Problem entsteht, weil der Klick von einem MouseDown + einem MouseUp generiert wird, und wenn Sie es am Rand des Übergangs tun, ist der MouseDown in einem Element und der MouseUp in einem anderen (und das erzeugt den Klick nicht). Andersherum (nicht wirklich das gleiche, aber höchstwahrscheinlich werden die Benutzer es nicht bemerken) macht es in mousedown statt klicken – vals