Vi è mai capitato di pensare di inserire nel vostro sito un piccolo player di file sonori (canzoni, suoni, etc..) per permettere ai visitatori di ascoltare un brano musicale, il tutto senza magari dover ricorrere a particolari programmi o linguaggi di programmazione?
Probabilmente si, ed altrettanto probabilmente avrete poi rinunciato in partenza, immaginandone la complessità di sviluppo. Eccovi allora un trucchetto che vi permetterà, con una semplice riga di codice HTML, di creare un piccolo player, comprensivo dei tasti PLAY, PAUSE e STOP, e perfino del controllo del volume!
Il Tag da utilizzare è <embed> compatibile con MS Internet Explorer, (dalla versione 3.0 in poi) e con Netscape Navigator (dalla versione 3.0 in poi).
In effetti <embed> non fa altro che richiamare il player di default installato sui PC e di impostarne determinate funzionalità attraverso una serie di attributi, di seguito in elenco, corredati da opportuni esempi.
Attributo "src"
Come per le immagini questo attributo serve a specificare l'indirizzo del file sonoro che si desidera riprodurre che, tra le varie estensioni supportate da questo plug-in, può essere di tipo:
Un esempio
Un esempio
Attributi "width" ed "height"
Impostano rispettivamente la larghezza e l'altezza del player.
Se avete come browser Internet Explorer, il player vi apparirà molto grande, rischiando di rovinare il layout della vostra pagina. Allo scopo di evitare questo inconveniente è bene dare sempre delle misure al player; questo si fa nello stesso modo in cui si danno le dimensioni a tabelle, immagini, e cosi via, ossia aggiungendo al Tag gli attributi width ed height, le cui misure andranno espresse in pixel.
Tenete poi anche conto che le dimensioni di default del player sono diverse a seconda del browser, altro motivo per cui è consigliabile impostarne dei valori fissi.
Nota: per evitare di mettere misure troppo piccole, e "tagliare fuori" cosi il controllo del volume, impostare la larghezza dell'embed minimo a 280.
Facciamo un esempio che comprende la barra del volume
Facciamo un secondo esempio che comprende solo i pulsanti PLAY e STOP
Attributo "autostart"
Noterete che la musica si avvierà automaticamente all'apertura della pagina. Ciò accade perchè l'attributo autostart è impostato di default a valore "true".
Se volete invece che la musica parta solo quando l'utente preme il bottone PLAY, impostate questo attributo a "false".
Facciamo un esempio
Attributo "loop"
E' possibile far si che il brano si ripeta (o meno) all'infinito, di modo che se l'utente vuole ascoltarlo più volte non deve ripremere PLAY ogni volta che la canzone finisce. Allo scopo dobbiamo chiamare in causa l'attributo loop.
Se impostato a 1 farà si che una volta terminata la canzone ricominci da capo automaticamente, all'infinito. Altrimenti, di default, loop assume valore 0, e una volta eseguito il brano il player si fermerà.
Ad esempio
Attributo "hidden"
Potete anche far si, volendo, che il player non venga visualizzato, impostando l'attributo hidden al valore "true" (il valore di default, com'è intuibile, è "false").
Può essere utile se volete mettere un sottofondo musicale al sito. Ricordatevi però in questo caso di settare l'attributo "autostart" a "true", in modo da far partire il brano in automatico, in quanto l'utente, non vedendo il player, non potrà interagirvi.
Un esempio
Il Tag "noembed"
Come accennato nel paragrafo introduttivo, c'è da dire anche che <embed> non è compatibile con tutti i browser; ecco perchè è bene aggiungere, subito dopo la chiusura </embed>, il Tag <noembed>, il cui scopo è fornire un testo alternativo in caso di mancato supporto.
Segue un esempio
Fonte: mrwebmaster.it
Probabilmente si, ed altrettanto probabilmente avrete poi rinunciato in partenza, immaginandone la complessità di sviluppo. Eccovi allora un trucchetto che vi permetterà, con una semplice riga di codice HTML, di creare un piccolo player, comprensivo dei tasti PLAY, PAUSE e STOP, e perfino del controllo del volume!
Il Tag da utilizzare è <embed> compatibile con MS Internet Explorer, (dalla versione 3.0 in poi) e con Netscape Navigator (dalla versione 3.0 in poi).
In effetti <embed> non fa altro che richiamare il player di default installato sui PC e di impostarne determinate funzionalità attraverso una serie di attributi, di seguito in elenco, corredati da opportuni esempi.
Attributo "src"
Come per le immagini questo attributo serve a specificare l'indirizzo del file sonoro che si desidera riprodurre che, tra le varie estensioni supportate da questo plug-in, può essere di tipo:
- .mp3
- .wav
- .midi
- .rmi
- .mpeg (per i video)
- .avi (per i video)
Un esempio
Un esempio
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Attributi "width" ed "height"
Impostano rispettivamente la larghezza e l'altezza del player.
Se avete come browser Internet Explorer, il player vi apparirà molto grande, rischiando di rovinare il layout della vostra pagina. Allo scopo di evitare questo inconveniente è bene dare sempre delle misure al player; questo si fa nello stesso modo in cui si danno le dimensioni a tabelle, immagini, e cosi via, ossia aggiungendo al Tag gli attributi width ed height, le cui misure andranno espresse in pixel.
Tenete poi anche conto che le dimensioni di default del player sono diverse a seconda del browser, altro motivo per cui è consigliabile impostarne dei valori fissi.
Nota: per evitare di mettere misure troppo piccole, e "tagliare fuori" cosi il controllo del volume, impostare la larghezza dell'embed minimo a 280.
Facciamo un esempio che comprende la barra del volume
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Attributo "autostart"
Noterete che la musica si avvierà automaticamente all'apertura della pagina. Ciò accade perchè l'attributo autostart è impostato di default a valore "true".
Se volete invece che la musica parta solo quando l'utente preme il bottone PLAY, impostate questo attributo a "false".
Facciamo un esempio
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Attributo "loop"
E' possibile far si che il brano si ripeta (o meno) all'infinito, di modo che se l'utente vuole ascoltarlo più volte non deve ripremere PLAY ogni volta che la canzone finisce. Allo scopo dobbiamo chiamare in causa l'attributo loop.
Se impostato a 1 farà si che una volta terminata la canzone ricominci da capo automaticamente, all'infinito. Altrimenti, di default, loop assume valore 0, e una volta eseguito il brano il player si fermerà.
Ad esempio
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Attributo "hidden"
Potete anche far si, volendo, che il player non venga visualizzato, impostando l'attributo hidden al valore "true" (il valore di default, com'è intuibile, è "false").
Può essere utile se volete mettere un sottofondo musicale al sito. Ricordatevi però in questo caso di settare l'attributo "autostart" a "true", in modo da far partire il brano in automatico, in quanto l'utente, non vedendo il player, non potrà interagirvi.
Un esempio
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Il Tag "noembed"
Come accennato nel paragrafo introduttivo, c'è da dire anche che <embed> non è compatibile con tutti i browser; ecco perchè è bene aggiungere, subito dopo la chiusura </embed>, il Tag <noembed>, il cui scopo è fornire un testo alternativo in caso di mancato supporto.
Segue un esempio
Codice:
Perfavore,
Entra
oppure
Registrati
per vedere i codici!
Fonte: mrwebmaster.it
