Inserire un video di Youtube con il volume muto

Mattepuffo's logo
Inserire un video di Youtube con il volume muto

Inserire un video di Youtube con il volume muto

Oggi vi propongo un modo per inserire un video di Youtube, in una pagina HTML, con il volume muto.

Useremo le iframe_api, quindi dovremmo includerle nella pagina:

https://www.youtube.com/iframe_api

A parte questo, non ci è richiesto nulla; solo un pò di codice Javascript.

Questa la pagina di esempio:

<!DOCTYPE html>
<html>
    <head>
        <title>Youtube no volume</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script async src="https://www.youtube.com/iframe_api"></script>
        <script>
            window.onload = function () {
                var player;
                player = new YT.Player('vy', {
                    videoId: 'ID_VIDEO',
                    width: 600,
                    height: 600,
                    playerVars: {
                        autoplay: 1,
                        controls: 1,
                        showinfo: 0,
                        modestbranding: 1,
                        loop: 1,
                        fs: 0,
                        cc_load_policty: 0,
                        iv_load_policy: 3,
                        autohide: 0
                    },
                    events: {
                        onReady: function (e) {
                            e.target.mute();
                        }
                    }
                });
            }
        </script>
    </head>
    <body>
        <div id="vy"></div>
    </body>
</html>

Come vedete sotto intercettiamo l'evento onReady della libreria, e impostiamo il target su mute.

Per testare questo codice dovete solo cambiare l'ID del video che vi serve.

Enjoy!


Condividi

Commentami!