Metoden slideUp

Metoden slideUp skjuler elementer jevnt ved å rulle dem opp fra bunnen. Vis elementer kan du med metoden slideDown.

Syntaks

Skjuling over en gitt varighet, 400ms som standard:

.slideUp(varighet);

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

.slideUp('slow' eller 'fast');

Hvis du ikke angir parametere - vil det ikke være noen animasjon, elementer vil bli skjult umiddelbart:

.slideUp();

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

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

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

.slideUp(alternativer);

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:

.slideUp( {duration: 800, easing: easeInSine} );

Eksempel

La oss etter å ha trykket på knappen, jevnt skjule foreldre-div-en som inneholder input-feltet og knappen, ved hjelp av metoden slideUp (denne div-en finner vi ved hjelp av metoden parent). Ved å sende nøkkelordet slow, setter vi hastigheten til 600ms. I div-en med #test vil vi skrive ut teksten 'Text is hidden':

<div>
	<button>hide text</button>
	<input type="text" value="aaa">
</div>
<div id="test"></div>

$('button').click(function() {
	$(this).parent().slideUp('slow', function() {
		$('#test').text('Text is hidden');
	});
});

Se også

metoden slideDown,
som jevnt viser elementer
metoden slideToggle,
som veksler mellom jevn visning/skjuling av elementer
metoden fadeOut,
som jevnt skjuler elementer, gjør dem gjennomsiktige
metoden hide,
som jevnt skjuler elementer