hide-metodi
hide-metodi piilottaa elementit pehmeästi. Elementit
voidaan näyttää käyttämällä
show-metodia.
Syntaksi
Katoaminen annetussa ajassa,
oletusarvoisesti 400ms:
.hide(kesto);
Aikaa voidaan asettaa ei vain millisekunteina,
vaan myös avainsanoilla slow (600ms)
ja fast (200ms), mitä suurempi arvo,
sitä hitaampi animaatio:
.hide('slow' tai 'fast');
Jos parametreja ei määritetä - animaatiota ei tule, elementit piilotetaan välittömästi:
.hide();
Toisena parametrina voidaan myös antaa easing-funktio, ja kolmantena callback-funktio - suoritetaan animaation valmistumisen jälkeen. Molemmat parametrit ovat valinnaisia:
.hide(kesto, [easing-funktio], [callback-funktio]);
Metodille voidaan antaa erilaisia valintoja, JavaScript-objektin muodossa, joka sisältää avain: arvo -pareja:
.hide(options);
Tällainen objekti voi välittää seuraavia
parametreja ja funktioita - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Näiden
parametrien kuvaukset voit katsoa metodista
animate. Esimerkiksi,
asetetaan kesto ja easing-funktio:
.hide( {duration: 800, easing: easeInSine} );
Esimerkki
#test -painikkeen napsautuksen jälkeen, pehmeästi
piilotetaan kappale käyttämällä hide-metodia. Antamalla
avainsanan slow, asetamme nopeudeksi
600ms. Animaation päätyttyä tulostamme
konsoliin 'Animation complete':
<button id="test">hide text</button>
<p>text</p>
$('#test').click(function() {
$('p').hide('slow', function() {
console.log('Animation complete')
});
});