Methode hide
De methode hide verbergt elementen vloeiend. Elementen
kunnen weer getoond worden met de methode
show.
Syntaxis
Verdwijnen over een opgegeven tijd,
standaard 400ms:
.hide(duur);
Tijd kan niet alleen in milliseconden worden opgegeven,
maar ook met de sleutelwoorden slow (600ms)
en fast (200ms), hoe groter de waarde,
hoe langzamer de animatie:
.hide('slow' of 'fast');
Als er geen parameters worden opgegeven - is er geen animatie, elementen worden onmiddellijk verborgen:
.hide();
Het is ook mogelijk om als tweede parameter een easing-functie door te geven, en als derde een callback-functie - deze wordt uitgevoerd na het voltooien van de animatie. Beide parameters zijn optioneel:
.hide(duur, [easing-functie], [callback-functie]);
Verschillende opties kunnen aan de methode worden doorgegeven, in de vorm van een JavaScript-object, dat sleutel: waarde paren bevat:
.hide(opties);
Zo'n object kan de volgende
parameters en functies doorgeven - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Beschrijvingen
van deze parameters zijn te vinden voor de methode
animate. Laten we bijvoorbeeld
de duur en easing-functie instellen:
.hide( {duration: 800, easing: easeInSine} );
Voorbeeld
Laten we na het klikken op knop #test, de
alinea vloeiend verbergen met de methode hide. Door het
sleutelwoord slow door te geven, stellen we de snelheid
in op 600ms. Na voltooiing van de animatie outputten we
'Animation complete' naar de console:
<button id="test">hide text</button>
<p>text</p>
$('#test').click(function() {
$('p').hide('slow', function() {
console.log('Animation complete')
});
});
