Programmazione Web » Html » Inserire un lettore mp3 in un sito web
Inserire un lettore mp3 in un sito web
Difficoltà:
Scritto da Alessandro Alessandrini
Sito Web: http://www.sitoservice.it 
Questo tutorial è stato letto 1494 volte
Vediamo ora come inserire un brano mp3 nel sito senza che appesantisca molto il caricamento della pagina.
La prima operazione da compiere è creare una nuova cartella nel sito che chiameremo MP3.
Ora, scegliete il brano mp3 da riprodurre e incollatelo nella nuova cartella appena creata.
Bene, ora avete pronta la cartella che conterrà il vostro mp3 e non rimane che inserire il comando nel sito che ci consenta di riprodurre il file.
Create una semplice pagina Html che chiamerete MP3.html e, nel Body incollate questa stringa di codice:
<embed src="MP3/branoMP3" width="180" height="80" autostart="true" loop="-1" </embed>
Salvate la pagina.
Questo codice consente di caricare un piccolo lettore attraverso il quale ascoltare i brani mp3.
Il parametro autostart="true" consente al brano di partire automaticamente.
Il parametro loop="-1" consente l'ascolto del brano in maniera ripetuta all'infinito.
Ora se pubblicate il sito e inserite l'url http://www.nomesito.it/mp3.html il lettorino si caricherà e il brano partirà automaticamente.
Sfogliando il sito però il brano smetterà l'esecuzione, vediamo allora come superare questo inconveniente in modo che gli utenti possano ascoltare il brano navigando sia sul vostro sito che su siti esterni.
Inserite nelle vostre pagine questo JavaScript che farà aprire una piccola finestra Pop-up contenente il lettorino Mp3:
<a href="javascript:void(0)" onclick="window.open('http://www.nomesito.it/mp3.html','Mp3', 'width=350,height=300,left=50,top=50');">Musica</a>
Questo codice creerà un link chiamato MUSICA che aprirà una finestra POP-UP di 350x300 pxl che farà partire il brano oltre che visualizzare il lettore.
Se poi non volete far apparire il lettore, ma volete far partire il brano appena caricata la pagina, ecco il codice da utilizzare:
<embed src="MP3/branoMP3" Volume="100" Autostart="True" Loop="True" Hidden="False">
Aggiungi questo tutorial ai preferiti
