In pratica

Chi volesse applicare degli effetti di comparsa e scomparsa di elementi HTML (div) può pensare alla libreria Scriptaculous che offre il metodo toggle della funzione Effect per creare un ingresso a tendina o con apparizione del div che si vuole mostrare o nascondere. L’utilizzo è davvero semplice.

1. Scaricate le librerie Javascript scriptaculous da scriptaculous e prototype.
2. Richiamatele nella pagina dove volete applicare l’effetto:
   <script src="javascripts/prototype.js" type="text/javascript"></script>
<script src="javascripts/scriptaculous.js" type="text/javascript"></script>
3. Racchiudete l’elemento che volete far sparire e/o comparire in due <div> dando un id univoco al primo:
   <div id="x">
<div>
contenunto
</div>
</div>
4. Aggiungete la chiamata alla funzione sull’evento di un elemento che desiderate, ad esempio sull’evento onclick di un tag <a>
   <a href="#"  onclick="Effect.toggle('x', 'slide', { delay: 0.5 });  return false;">Apri dettagli</a>

Tipi di effetti ed opzioni

Per Effect.toggle è prevista la seguente sintassi:
Effect.toggle(element, ['appear' | 'slide' | 'blind'], [options] );

Ecco alcuni esempi:
Effect.toggle('id_of_element', 'appear');
Effect.toggle('id_of_element', 'slide', { delay: 0.5 });
Effect.toggle('id_of_element', 'blind', { duration: 2.0 });


Riferimenti

Primi passi con scriptaculous: http://wiki.github.com/madrobby/scriptaculous
Esempi: http://wiki.github.com/madrobby/scriptaculous/effect-toggle