Neueste Web-Entwicklung Tutorials
 

jQuery Effekte - Verstecken und Zeigen


Ausblenden, Show, Toggle, Rutsche, verblassen und Animieren. BEEINDRUCKEND!

Klicken / verbergen Fenster anzuzeigen

Weil die Zeit wertvoll ist, liefern wir schnell und einfach das Lernen.

Bei w3ii, können Sie alles, was Sie brauchen studieren zugängliche und handliches Format zu lernen, in.


Beispiele

jQuery hide()
Demonstriert eine einfache jQuery hide() Methode.

jQuery hide()
Ein weiterer hide() Demonstration. Wie Teile des Textes zu verstecken.


jQuery hide() und show()

Mit jQuery, können Sie verstecken und HTML - Elemente mit der Show hide() und show() Methoden:

Beispiel

$("#hide").click(function(){
    $("p").hide();
});

$("#show").click(function(){
    $("p").show();
});
Versuch es selber "

Syntax:

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

Der optionale Geschwindigkeitsparameter gibt die Geschwindigkeit des Ein- / Ausblenden, und kann die folgenden Werte annehmen: "slow", "fast" oder Millisekunden.

Der optionale Rückruf Parameter ist eine Funktion , nachdem die ausgeführt werden hide() oder show() Methode abgeschlossen ist (Sie mehr über Callback - Funktionen in einem späteren Kapitel lernen).

Das folgende Beispiel zeigt die Geschwindigkeitsparameter mit hide() :

Beispiel

$("button").click(function(){
    $("p").hide(1000);
});
Versuch es selber "

jQuery toggle()

Mit jQuery, können Sie zwischen dem Umschalten hide() und show() Methoden mit dem toggle() Methode.

Gezeigt Elemente sind versteckt und versteckte Elemente angezeigt werden:

Beispiel

$("button").click(function(){
    $("p").toggle();
});
Versuch es selber "

Syntax:

$(selector).toggle(speed,callback);

Die optionale Geschwindigkeits Parameter kann die folgenden Werte annehmen: "slow", "fast" oder Millisekunden.

Der optionale Rückruf Parameter ist eine Funktion nach ausgeführt werden toggle() abgeschlossen ist .


Testen Sie sich mit Übungen!

Übung 1 » Übung 2» Übung 3 » Übung 4»


jQuery Effects Referenz

Eine vollständige Übersicht über alle jQuery - Effekte, gehen Sie bitte auf unsere jQuery Effect Referenz .