Methode show
Die Methode show blendet versteckte
Elemente sanft ein. Elemente können mit der Methode
hide
ausgeblendet werden.
Syntax
Einblenden über eine festgelegte Zeit in Millisekunden,
standardmäßig 400ms:
.show(Dauer);
Die Zeit kann nicht nur in Millisekunden angegeben werden,
sondern auch mit den Schlüsselwörtern slow (600ms)
und fast (200ms). Je größer der Wert,
desto langsamer die Animation:
.show('slow' oder 'fast');
Wenn keine Parameter angegeben werden - erfolgt keine Animation, die Elemente werden sofort eingeblendet:
.show();
Es kann auch als zweiten Parameter eine Easing-Funktion übergeben werden, sowie als dritten Parameter eine Callback-Funktion - wird nach Abschluss der Animation ausgeführt. Beide Parameter sind optional:
.show(Dauer, [Easing-Funktion], [Callback-Funktion]);
Der Methode können verschiedene Optionen übergeben werden, in Form eines JavaScript-Objekts, das Schlüssel: Wert-Paare enthält:
.show(Optionen);
Ein solches Objekt kann die folgenden
Parameter und Funktionen übergeben - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Die Beschreibung
dieser Parameter können Sie für die Methode
animate nachlesen. Zum Beispiel,
legen wir Dauer und Easing-Funktion fest:
.show( {duration: 800, easing: easeInSine} );
Beispiel
Lassen Sie uns nach dem Drücken einer Taste einen versteckten
Absatz mit der Methode show sanft einblenden. Durch Übergabe
des Schlüsselworts slow setzen wir die Geschwindigkeit
auf 600ms. Nach Ende der Animation geben wir
'Animation complete' in der Konsole aus:
<button>Text einblenden</button>
<p style="display: none">Text</p>
$('button').click(function() {
$('p').show('slow', function() {
console.log('Animation complete')
});
});
