Ich habe die folgende CSS-Animation:
%Vor%Grundsätzlich möchte ich Folgendes tun:
• Bei hover (also .border-strobe:hover
) möchte ich zum Beispiel die Rahmenfarbe in #FF1D38
ändern.
• Sobald ich den Hover verschoben habe, möchte ich die Animation einfach normal laufen lassen.
Das Problem ist jedoch, dass ich ein paar Elemente auf den Seiten mit der Klasse .border-strobe
habe und ich möchte sie in der Zeit behalten.
Gibt es eine einfache Möglichkeit, die Rahmenfarbe mit dem Hover zu überschreiben und die Animationen miteinander konsistent zu halten, oder ist das momentan nicht möglich?
Macht das Sinn?
Gibt es einen Grund, warum Sie die Animation normal weiterlaufen lassen möchten?
Wenn die gewünschte Hover-Farbe der Anfang und das Ende der Animation ist, warum sollten Sie die Animation nicht bei Hover beenden, während die Rahmenfarbe in der Hover-Klasse definiert ist?
Hier ist das nächste, was ich bekommen konnte: Ссылка
AKTUALISIEREN
Ich kann nicht glauben, dass ich vorher nicht darüber nachgedacht habe! Wenn Sie bereit sind, den HTML-Code zu ändern, können Sie einen Maskenbereich (oder div oder was auch immer Sie wollen) einfügen und den Rahmen ändern, wenn Sie den Mauszeiger über den Rahmen bewegen.
Hier ist das Update von jsFiddle: Ссылка
Tags und Links css css3 css-animations