jQuery animiert die CSS-Eigenschaft "text-shadow"

CSS-Übergänge sind der beste Weg dafür, da jeder Browser, der häufig Text-Schatten unterstützt, auch Übergänge unterstützt.

In diesem Fall legen Sie einfach die Übergangseigenschaften fest und ändern dann den Stil entweder mit JS oder durch Ändern der Klasse.

Grundlegendes Beispiel: Ссылка

Weitere Informationen zum Nachrüsten von jQuery: Ссылка

Nachdem ich mich eine Weile umgesehen habe und festgestellt habe, dass es so ziemlich alle Lösungen für ältere Versionen von JQuery gibt, habe ich aufgegeben und diese Funktionen geschrieben, die meistens 500ms Ein- oder Ausblenden bewirken:

Dann implementieren Sie es einfach mit einem JQuery-Hover-Handler wie folgt:

Das einzige, was ich an ihnen nicht mag, ist, dass wenn man schnell über das Objekt schwebt, es flackert, wenn es zwischen den beiden Funktionen wechselt, aber es zumindest immer in einem Endzustand bleibt, in dem es nicht verblasst ist.

Meine Implementierung war nicht so kritisch, also ging ich nicht weiter, aber das könnte theoretisch überwunden werden, indem dem Objekt eine flag -Eigenschaft hinzugefügt wird, die die letzte Aktion setzt, und dann die Funktion das Flag jeweils überprüfen lässt Mal führt es einen Schritt aus.

Andere Gründe, warum es nicht ideal ist:

• Es ist nicht sehr intuitiv, das Timing oder Level zu ändern, da Sie sich sowohl mit der Schleife als auch mit dem Multiplikator herumschlagen müssen
• Es werden nur lineare Schritte durchgeführt
• Es ist wahrscheinlich keine sehr effiziente Art, das zu tun.
• Jedes Steuerelement, für das Sie diese Funktionen verwenden möchten, muss eine ID haben oder es wird nicht funktionieren.

Aber auf der hellen Seite sollte es mit jeder JQuery-Version funktionieren und es ist stabil.