jQuery-effecten - Sliding
De jQuery-schuifmethoden schuiven elementen op en neer.
Klik om het paneel omlaag/omhoog te schuiven
Omdat tijd kostbaar is, leveren we snel en gemakkelijk leren.
Bij W3Schools kun je alles bestuderen wat je moet leren, in een toegankelijk en handig formaat.
Voorbeelden
Demonstreert de jQuery slideDown()-methode.
Demonstreert de jQuery slideUp()-methode.
Demonstreert de jQuery slideToggle()-methode.
jQuery-schuifmethoden
Met jQuery kun je een glijdend effect op elementen creëren.
jQuery heeft de volgende dia-methoden:
slideDown()slideUp()slideToggle()
jQuery slideDown() Methode
De jQuery- slideDown()methode wordt gebruikt om een element naar beneden te schuiven.
Syntaxis:
$(selector).slideDown(speed,callback);
De optionele snelheidsparameter specificeert de duur van het effect. Het kan de volgende waarden aannemen: "slow", "fast" of milliseconden.
De optionele callback-parameter is een functie die moet worden uitgevoerd nadat het glijden is voltooid.
Het volgende voorbeeld demonstreert de slideDown()methode:
Voorbeeld
$("#flip").click(function(){
$("#panel").slideDown();
});
jQuery slideUp() Methode
De jQuery- slideUp()methode wordt gebruikt om een element omhoog te schuiven.
Syntaxis:
$(selector).slideUp(speed,callback);
De optionele snelheidsparameter specificeert de duur van het effect. Het kan de volgende waarden aannemen: "slow", "fast" of milliseconden.
De optionele callback-parameter is een functie die moet worden uitgevoerd nadat het glijden is voltooid.
Het volgende voorbeeld demonstreert de slideUp()methode:
Voorbeeld
$("#flip").click(function(){
$("#panel").slideUp();
});
jQuery slideToggle() Methode
De jQuery- slideToggle()methode schakelt tussen de slideDown()en slideUp()
methoden.
Als de elementen naar beneden zijn geschoven, slideToggle()zullen ze naar boven schuiven.
Als de elementen omhoog zijn geschoven, slideToggle()schuiven ze naar beneden.
$(selector).slideToggle(speed,callback);
De optionele snelheidsparameter kan de volgende waarden aannemen: "langzaam", "snel", milliseconden.
De optionele callback-parameter is een functie die moet worden uitgevoerd nadat het glijden is voltooid.
Het volgende voorbeeld demonstreert de slideToggle()methode:
Voorbeeld
$("#flip").click(function(){
$("#panel").slideToggle();
});
jQuery-oefeningen
jQuery Effecten Referentie
Ga voor een compleet overzicht van alle jQuery-effecten naar onze jQuery-effectreferentie .