Web Design  »  Articoli  »  Web design 

Vediamo subito l'esempio. Per prima cosa il file Javascript va messo nella stessa cartella della pagina HTML, e linkato nella sezione head in questo modo:

<script type="text/Javascript" src="flashobject.js"></script>

Nel punto del body in cui vogliamo mettere il filmato inseriremo le seguenti righe:

<script type="text/Javascript">
  // <![CDATA[
  var myFlashObject=new FlashObject("fish.swf","fish","350","200",6,"#0000FF");
  myFlashObject.write();
  // ]]>
</script>
<noscript>
  <p>Filmato con animazione di acquario con Macromedia Flash.</p>
</noscript>

In grassetto i parametri da passare alla funzione Javascript, che sono nell'ordine: percorso e nome del filmato, id da assegnare al filmato, larghezza, altezza, versione di Flash richiesta e colore di sfondo. Lo script si occuperà di verificare la versione di Flash (nel caso sia disponibile una versione inferiore verrà mostrato un avviso con il link per l'upgrade) e di incorporare il filmato. Nel caso in cui Javascript sia disabilitato, verrà semplicemente mostrato il testo all'interno del tag noscript.

Se volessimo passare dei parametri aggiuntivi al filmato Flash, come penultima riga, all'interno del tag script si dovrebbe aggiungere:

myFlashObject.addVariable("nome parametro", "valore");

Lo script si presta anche a un'altra soluzione, a parer mio migliore dato che permette di evitare l'uso del tag script nell'interno del body. Vediamo subito l'esempio e il relativo codice HTML:

<div id="flashcontainer">
    <p>Filmato con animazione di acquario con Macromedia Flash.</p>
</div>

Tutto qui. Si tratta solo di assegnare un id al contenitore del filmato, e inserire ciò (testo, immagine, o link) che verrà mostrato solo nel caso in cui Javascript sia disabilitato. Una cosa che consiglio è attribuire alle dimensioni del container quelle del filmato flash via CSS:

<style type="text/css">
/* ... */
div#flashcontainer{width:350px;height:200px}
</style>

A questo punto veniamo al Javascript. Nella sezione head della pagina, oltre che a inserire le righe per lo script esterno, aggiungeremo uno script incorporato per il filmato. Ecco il codice:

<script type="text/Javascript" src="flashobject.js"></script>
<script type="text/Javascript">
window.onload=function(){
    var myFlashObject = new FlashObject("fish.swf", "fish", "350", "200", 6, "#0000FF");
    myFlashObject.write("flashcontainer");
    }
</script>

I parametri per aggiungere lo script sono gli stessi dell'esempio precedente. In più, in questo caso, come evidenziato in grassetto, si dice allo script di inserire il filmato flash nell'elemento con id uguale a "flashcontainer". Lo script incorprato volendo si può inserire in un file Javascript esterno o nello stesso flashobject.js, così da mantenere totalmente separato HTML e Javascript.

Conclusioni

Termina qui l'articolo, in cui abbiamo visto diversi modi per incorporare filmati Flash. Due parole sulla compatibilità: gli esempi sono stati testati con successo su sistema Windows con Internet Explorer 6, Mozilla 1.6 e Opera 7.54; su Mac i browser usati sono Firefox 1.0 e Safari 1.2.3. Personalmente, il modo che ritengo più indicato tra i tanti visti è l'ultimo, dato che consente di mantenere il codice HTML molto leggero.
Codice ed esempi sono disponibili per il download. Alla prossima.

Altri articoli

Altre guide

Altre newsletter