A slideDown metódus

A slideDown metódus lágyan megjeleníti az elrejtett elemeket, felülről lefelé gördítve azokat. Az elemek elrejtéséhez használható a slideUp metódus.

Szintaxis

Megjelenítés adott időtartam alatt, alapértelmezetten 400ms:

javascript.slideDown(duration);

Az időt nem csak ezredmásodpercben lehet megadni, hanem kulcsszavakkal is: slow (600ms) és fast (200ms), minél nagyobb az érték, annál lassabb az animáció:

javascript.slideDown('slow' vagy 'fast');

Ha nincs paraméter megadva - nem lesz animáció, az elemek azonnal megjelennek:

javascript.slideDown();

A második paraméterként átadható egy easing függvény, a harmadik paraméterként pedig egy callback függvény - amely az animáció befejezése után fut le. Mindkét paraméter opcionális:

javascript.slideDown(duration, [easing function], [callback function]);

Átadhatunk a metódusnak különböző opciókat, JavaScript objektum formájában, amely kulcs: érték párokat tartalmaz:

javascript.slideDown(options);

Egy ilyen objektum a következő paramétereket és függvényeket adhatja át - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Ezen paraméterek leírását megtalálhatod a animate metódusnál. Például, állítsuk be az időtartamot és az easing függvényt:

javascript.slideDown( {duration: 600, easing: easeInSine} );

Példa

Egy gomb megnyomására lágyan jelenítsük meg az elrejtett bekezdést a slideDown metódussal. A slow kulcsszó átadásával a sebességet 600ms-ra állítjuk. Az animáció befejezése után írjunk ki a konzolra 'Animation complete'-t:

html<button>szöveg megjelenítése</button>
<p style="display: none">szöveg</p>

javascript$('button').click(function() {
  $('p').slideDown('slow', function() {
    console.log('Animation complete')
  });
});

Lásd még