Dies ist ein sehr ähnliches Problem zu CSS3 Bei animiertem Element drehen, wodurch das Klickereignis nicht aufgerufen wird
Obwohl mein Problem etwas anders ist, kann ich dazu keine zusätzlichen Informationen hinzufügen.
Beachte meine Sandbox: Ссылка
Ich habe eine Spanne innerhalb eines Links, der sich um die Y-Achse dreht, wenn die Maus schwebt. Das Klickereignis (für jQuery oder einfach für die Linknavigation) wird nicht immer erkannt. Klicken Sie auf den gepolsterten Bereich des Links (direkt neben dem Text, aber auf dem Link). Es ist fast so, als ob es ein Problem mit der Treffererkennung gibt, weil sich die Spanne dreht und somit in Winkeln, wo die Maus nicht auf die Spanne klickt. Obwohl die Maus immer noch auf die gepolsterte Region des LINK klickt. Winkel um 70-110 Grad scheinen das Problem zu sein.
Die vorgeschlagene Lösung in dem oben genannten Post löst dieses Problem nicht wirklich. Außerdem ist mein Problem vielleicht etwas anders, da meine Rotation als CSS-Übergang statt als JS-Intervall-Trigger behandelt wird.
Irgendwelche Gedanken? Hat das jemand schon mal gesehen? Ich weiß, das ist eine käsige Art, Links zu erstellen, aber für die Zielwebseite ist es eine akzeptable Menge Käse.
Fühlen Sie sich frei, die jsfiddle zu vereinfachen, ich begann einfach und fügte ein bisschen Debugging-Informationen hinzu, um das Problem zu identifizieren.
html:
%Vor%css:
%Vor%JS:
%Vor%Das Problem. Da es Browser-Desparitäten gibt, die CSS verwenden, und sogar Desparitäten zwischen Browsern, haben Sie Probleme mit einer reinen CSS-Lösung. Sie müssen auch erkennen, dass CSS Ihre Divs tatsächlich zusammenfaltet, wenn sie mitten in einer Animation sind. Unsere Vision ist nicht wirklich, was passiert, es ist eigentlich die div Größe auf 0, was bedeutet, wenn Sie klicken Sie nicht in der Lage sein wird, "tatsächlich klicken Sie darauf. unten zeigt, sollten Sie eine absolute position div als Overlay und behandeln den Klick sogar von einem klaren, nicht sichtbaren Div, das immer noch die Illusion hat, dass du tatsächlich auf einen Link klickst.
%Vor%Tags und Links html css3 css-transforms css-transitions onclick