Metoden slideToggle
Metoden slideToggle viser
skjulte elementer jævnt og skjuler viste elementer.
Syntaks
Visning/skjuling over en given varighed,
400ms som standard:
.slideToggle(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:
.slideToggle('slow' eller 'fast');
Hvis parametre ikke angives - vil der ikke være animation, elementer vil blive vist/skjult øjeblikkeligt:
.slideToggle();
Det er også muligt at sende en easing-funktion som anden parameter, samt en callback-funktion som tredje parameter - udføres efter animationens gennemførelse. Begge parametre er valgfrie:
.slideToggle(varighed, [easing-funktion], [callback-funktion]);
Det er muligt at sende metoden forskellige indstillinger, i form af et JavaScript-objekt, der indeholder par nøgle: værdi:
.slideToggle(indstillinger);
Sådan et objekt kan sende 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 indstille varighed og easing-funktion:
.slideToggle( {duration: 600, easing: easeInSine} );
Eksempel
Lad os efter et klik på knappen, jævnt skjule
den overordnede div, som indeholder afsnit,
ved hjælp af metoden slideToggle (denne div
finder vi ved hjælp af metoden
parent),
efter gentaget klik på knappen, vil div
igen blive vist jævnt osv. Ved at sende nøgleordet
slow indstiller vi hastigheden til 600ms:
<button>toggle tekst</button>
<div>
<p id='test'>tekst tekst tekst tekst tekst tekst tekst</p>
<p>tekst tekst tekst tekst tekst tekst tekst</p>
<p>tekst tekst tekst tekst tekst tekst tekst</p>
</div>
$('button').click(function() {
$('#test').parent().slideToggle('slow');
});
