Metoden slideUp

Metoden slideUp skjuler elementer jævnt ved at trække dem op fra bunden. Vis elementer igen ved hjælp af metoden slideDown.

Syntaks

Skjul over en given varighed, 400ms som standard:

.slideUp(varighed);

Tid kan angives ikke kun i millisekunder, men også med nøgleordene slow (600ms) og fast (200ms), jo højere værdi, jo langsommere animation:

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

Hvis ingen parametre angives - vil der ikke være nogen animation, elementer vil blive skjult øjeblikkeligt:

.slideUp();

Man kan også som anden parameter sende en easing-funktion, og som tredje parameter en callback-funktion - udføres efter animationen er færdig. Begge parametre er valgfrie:

.slideUp(varighed, [easing-funktion], [callback-funktion]);

Man kan sende metoden forskellige indstillinger, i form af et JavaScript-objekt, der indeholder nøgleværdi-par nøgle: værdi:

.slideUp(options);

Et sådant objekt kan overføre følgende parametre og funktioner - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Beskrivelse af disse parametre kan du se for metoden animate. For eksempel, lad os sætte varigheden og easing-funktionen:

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

Eksempel

Lad os efter et klik på knappen, jævnt skjule den overordnede div, der indeholder inputfeltet og knappen, ved hjælp af metoden slideUp (denne div finder vi ved hjælp af metoden parent). Ved at sende nøgleordet slow, sætter vi hastigheden til 600ms. I div med #test vil vi udskrive 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 jævnt viser elementer
metoden slideToggle,
som veksler mellem jævn visning/skjulning af elementer
metoden fadeOut,
som jævnt skjuler elementer, ved at gøre dem gennemsigtige
metoden hide,
som jævnt skjuler elementer