Come inserire video di YouTube con avvio automatico e nessun suono

Sommario

In questo tutorial ti insegnerò come inserire un video di youtube sulla tua pagina web che si avvia automaticamente al caricamento di una pagina e non ha audio. Per questo utilizzeremo l'API fornita da Youtube. Dovremo scrivere codice in JavaScript, davvero poco, cominciamo.

Passo 1
La prima cosa di cui abbiamo bisogno per continuare è l'identificatore del video che vogliamo caricare. Per questo entriamo in YouTube e cerchiamo il video desiderato, l'id di questo verrà da v = all'interno dell'URL, nell'immagine seguente ti mostro un esempio:

Adesso possiamo aggiungere lo script alla nostra pagina, di seguito spiego alcuni dettagli da tenere in considerazione.

Passo 2
Abbiamo bisogno di uno spazio nel nostro HTML dove aggiungere il player, per questo usiamo un div, quell'istruzione nel codice è questa (l'id è necessario per la funzione che usiamo dall'API):

Puoi mettere l'id che vuoi, se lo cambi, nota che nel codice nel passaggio 4 appare anche durante la creazione del player, dovrai cambiarlo anche tu, poiché si riferisce a questo div tramite l'id.

Passaggio 3
Colleghiamo l'API di YouTube alla nostra pagina, per questo scriviamo le seguenti istruzioni:

 
Si noti che questo è un carico asincrono.

Passaggio 4
Aggiungiamo alcuni tag di script (alla fine del corpo stesso), in essi creeremo la funzione suYouTubeIframeAPIReady (). Il nome della funzione lo devi lasciare così. All'interno di questa funzione configureremo la larghezza, l'altezza del player, l'ID del video e alcune altre caratteristiche.

 
[color = # a9a9a9] Codice con l'API Youtube [/ color]

Alcuni approfondimenti

  • L'ID video deve essere inserito in ID video.
  • Per l'avvio automatico viene utilizzato riproduzione automatica, 1 sarà che inizia da solo, se metti 0 non lo farà.
  • Per silenziarlo, all'interno dell'area eventi viene utilizzata la seguente funzione:
 onReady: funzione (e) {e.target.mute (); }
Puoi anche configurare il numero di volte in cui il video viene ripetuto (loop), se vengono mostrati i controlli, come riproduzione, volume, ecc.

Ecco il codice completo:

Quando si apre il file che ha il codice sopra, apparirà il player, come mostrato nell'immagine seguente:

INGRANDIRE

Nel caso volessi il codice ti lascio qui un zip:

videoYoutube.zip 533 byte 245 download

Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo

Aiuterete lo sviluppo del sito, condividere la pagina con i tuoi amici

wave wave wave wave wave