jQuery - Wie blendet man von einer Farbe zur anderen ein/aus? (möglich 3rd party plugin fo jQuery?)

Question

Ich bin auf der Suche nach einem jQuery-Skript oder ein 3rd-Party-Plugin für jQuery, die ein Fade in/out-Effekt auf der Grundlage von "von Farbe" und "bis Farbe" erstellen können. Beispiel, wie ich es sehe:

$( selector ).fadeColor({
    from: "#900", // maroon-red color
    to: "#f00",   // blood-red color
}, 3000); // last argument is the time interval, in milliseconds in this particular case it's based for 3 seconds

Answer 1

jQuery UI erweitert jQuery's animate Methode, um die Farbanimation einzubeziehen. Sie können dann etwas tun wie:

$("#someId").animate({backgroundColor: "#ff0000" });

Hier ist ein Arbeitsbeispiel .

Answer 2

Sie brauchen kein weiteres Plugin. Beispiel:

jQuery

$(selector).css("color", "blue");

CSS

selector {
  transition: color .3s;
}

Das funktioniert problemlos (und ohne die Website zu verlangsamen).

Answer 3

Die jQuery-Benutzeroberfläche Animationsfunktion wird es tun.

Siehe hier für jsFiddle.

Answer 4

Hier sind meine 2 Cents wert - ein jsFiddle einer kontinuierlich pulsierenden Schaltfläche, ausgelöst, wenn das Dokument geladen wird.

Demo hier

function fadeDivIn(){
    $("#div").animate({backgroundColor: "#ed3" }, 4000, function(){fadeDivOut();});
}

function fadeDivOut(){
    $("#div").animate({backgroundColor: "#3de" }, 4000, function(){fadeDivIn();});
}

$(document).ready(function(){
    fadeDivIn();
});