How to change the volume of an <iframe> video by javascript?

Asked

Viewed 675 times

7

I have tried the code below to solve.

var volumeIcon = 1;

$(".ico-volume").on('click', function(event) {

   if (volumeIcon == 1)
   {
      $(this).find("img").removeAttr('src');
      $(this).find("img").attr('src', 'img/ico/volume-out-ico.png');
      volumeIcon = 0;
      setVolume(volumeIcon);
   }
   else
   {
      $(this).find("img").removeAttr('src');
      $(this).find("img").attr('src', 'img/ico/volume-in-ico.png');
      volumeIcon = 1;
      setVolume(volumeIcon);
   }

});

essa primeira função é de um icone de volume que eu tenho aqui, e quando o usuário apertar ele troca a imagem, mas se atentem na função que ele chama por ultimo. Pois bem, aqui vai as outras funções:

function onYouTubePlayerReady(playerId)
{
    ytplayer = document.getElementById("video");  
}

function setVolume(volume)
{
    if (ytplayer)
        ytplayer.volume = volume;
}

Obs: In the player’s HTML, I already put the parameter in the enablejsapi=1 in the <iframe>.

Could someone help me, please? D

javascript iframe youtube

  • Well, from the way my code came out, I can tell it’s the first time I’ve ever put it here. kkkkkkkkkk I’m sorry about that. If anyone can tell me how to put a code in here I’d appreciate it too! ^^

  • where Youtube video comes from?

  • @Caiochaim Welcome to Stackoverflow, it would be interesting to check out the http://answall.com/tour tour to see how the site works.

  • 2

    Thanks Marconi for the tip! = D yes Danilo, I forgot to mention, is from Youtube yes!

  • You’re incorporating the iframe. For example: <iframe width="854" height="480" src="https://www.youtube.com/embed/PearQPnNzE?list=WL" frameborder="0" allowfullscreen></iframe>

  • 1

    that’s it, that’s it! :)

Show 1 more comment

1 answer

2

I searched here on the Youtube API and look what I found:

Disable the player sound.

player.mute():Void

Activates the sound of the player.

player.unMute():Void

Returns true if player is muted. If negative, returns false.

player.isMuted():Boolean

Sets the volume. Accepts an integer number between 0 and 100.

That’s what you have to do in your code.

player.setVolume(volume:Number):Void

Returns the current volume of the player, an integer number between 0 and 100. getVolume() will return the volume even if the player is muted.

player.getVolume():Number

Follow the Youtube API Link.

https://developers.google.com/youtube/js_api_reference?hl=pt-br

Browser other questions tagged javascript iframe youtube

You are not signed in. Login or sign up in order to post.