Ich möchte einen fadeIn Effekt auf einen addClass function..and fadeOut gelten removeClass ...jQuery hinzufügen/entfernen Klasse mit fadeIn/Out
Können Sie mir helfen?
Dies ist mein Code
$('#loader'+idTurno).addClass('loader');
...
$('#loader'+idTurno).removeClass('loader');
Aufblenden:
$("#loader").fadeIn("slow", function() {
$(this).addClass("loader");
});
Fade Out:
$("#loader").fadeOut("slow", function() {
$(this).removeClass("loader");
});
Wie ein anderer Benutzer sagte, möchten Sie vielleicht mit toggleClass nachsehen.
Sie sollten eine Dauer hinzufügen zum Entfernen/addClass Methode:
$('#loader'+idTurno).addClass('loader',500);
$('#loader'+idTurno).removeClass('loader',500);
Diese Antwort ist offensichtlich falsch, da es unter https://api.jquery.com/addClass/ keine "duration" -Eigenschaft für die Methoden '$ .addClass()' oder '$ .removeClass()' gibt. – DavidScherer
Wenn wir nur jquery verwenden, wäre Ihre Anweisung @DavidScherer korrekt. Wenn jedoch das OP jqueryUI verwendet, wäre das oben Gesagte korrekt, da jqueryUI tatsächlich (während es ziemlich schwierig ist, ein solches kleines Merkmal hinzuzufügen) das Ein- und Ausblenden einer Klasse mit einer Dauer unterstützt. http://api.jqueryui.com/addClass/ –
Ein anderer Weg, das zu erreichen, Ihre ursprüngliche jQuery-Code, der CSS Art und Weise:
#loader {
transition: opacity 500 ease-in-out;
}
flüssigere Animation, einfacher aufrecht erhalten.
Machen Sie es einfach:
$('#loader'+idTurno).addClass('loader').fadeIn(1000);
$('#loader'+idTurno).removeClass('loader').fadeIn(1000);
Dadurch wird das gesamte DIV ein- oder ausgeblendet, nicht nur die Klasse. –
#loader {
transition: all 0.9s ease-out 0s;
}
@minitech ich die obige Lösung versucht, aber wenn die zweite Funktion läuft (fadeout) das Element vollständig disappears.In meinem Fall die Elemente Dropdown-Menü (Auswahl). Was ich bemerkt habe ist, dass für das Element, das aus der Ansicht verschwindet, ein Anzeigestil angezeigt wird: Keiner wird angewendet. Warum das passiert? –
@DimitrisPapageorgiou Lesen Sie die Dokumentation von 'fadeOut()'. Es geht darum, wie nach der Deckkraft auf 0 gesetzt wird, ist die Anzeige-Eigenschaft auf "display: none" gesetzt - http://api.jquery.com/fadeout/ –
@minitexh ja .... Sie haben Recht, was sind meine Alternativen? Wie auch immer, die Geige ist hier http://jsfiddle.net/fiddlehunt/achgnmcv/ versuche, einen Wert auf das Von Menü –