show-metodi
show-metodi näyttää piilotetut
elementit sulavasti. Elementit voidaan piilottaa käyttämällä
hide-metodia.
Syntaksi
Näyttö annetulla ajalla millisekunteina,
oletusarvoisesti 400ms:
.show(kesto);
Aikaa voidaan asettaa ei vain millisekunteina,
vaan myös avainsanoilla slow (600ms)
ja fast (200ms), mitä suurempi arvo,
sitä hitaampi animaatio:
.show('slow' tai 'fast');
Jos parametreja ei anneta - animaatiota ei tule, elementit näytetään välittömästi:
.show();
Voidaan myös toisena parametrina antaa easing-funktio, sekä kolmantena callback-funktio - suoritetaan animaation valmistumisen jälkeen. Molemmat parametrit ovat valinnaisia:
.show(kesto, [easing-funktio], [callback-funktio]);
Metodille voidaan antaa erilaisia asetuksia, JavaScript-objektin muodossa, joka sisältää avain: arvo -pareja:
.show(options);
Tällainen objekti voi välittää seuraavia
parametreja ja funktioita - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. Kuvauksen
näistä parametreista voit katsoa metodin
animate kohdasta. Esimerkiksi,
asetetaan kesto ja easing-funktio:
.show( {duration: 800, easing: easeInSine} );
Esimerkki
Napin painamisen jälkeen, näytetään sulavasti
piilotettu kappale käyttämällä show-metodia. Antamalla
avainsanan slow, asetamme nopeudeksi
600ms. Animaation päätyttyä tulostamme
konsoliin 'Animaatio valmis':
<button>näytä teksti</button>
<p style="display: none">teksti</p>
$('button').click(function() {
$('p').show('slow', function() {
console.log('Animation complete')
});
});
