Metoden slideDown

Metoden slideDown viser skjulte elementer jevnt, ved å rulle dem ned fra toppen. Skjul elementer med metoden slideUp.

Syntaks

Visning over en gitt varighet, 400ms som standard:

javascript.slideDown(varighet);

Tid kan angis ikke bare i millisekunder, men også med nøkkelordene slow (600ms) og fast (200ms), jo høyere verdi, jo tregere animasjon:

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

Hvis du ikke angir parametere - vil det ikke være noen animasjon, elementer vil vises øyeblikkelig:

javascript.slideDown();

Du kan også sende en easing-funksjon som andre parameter, og en tredje callback-funksjon - som utløses etter at animasjonen er fullført. Begge parameterne er valgfrie:

javascript.slideDown(varighet, [easing-funksjon], [callback-funksjon]);

Du kan sende metoden ulike alternativer, i form av et JavaScript-objekt som inneholder par nøkkel: verdi:

javascript.slideDown(options);

Et slikt objekt kan sende følgende parametere og funksjoner - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Beskrivelse av disse parameterne kan du se for metoden animate. For eksempel, la oss sette varighet og easing-funksjon:

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

Eksempel

La oss etter å ha trykket på knappen, jevnt vise et skjult avsnitt med metoden slideDown. Ved å sende nøkkelordet slow, setter vi hastigheten til 600ms. Etter at animasjonen er fullført, skriver vi ut 'Animation complete' til konsollen:

html<button>vis tekst</button>
<p style="display: none">tekst</p>
javascript$('button').click(function() {
  $('p').slideDown('slow', function() {
    console.log('Animation complete')
  });
});

Se også

  • metoden slideUp,
    som skjuler elementer jevnt
  • metoden slideToggle,
    som veksler mellom jevn visning/skjuling av elementer
  • metoden fadeIn,
    som viser skjulte elementer jevnt, gjør dem ugjennomsiktige
  • metoden show,
    som viser elementer jevnt