CODEWITHSUNDEEP
javascriptiframeyoutubeyoutube-apipause
shahidfoy
shahidfoy

Reputation: 2301

Play and pause iframe videos using buttons in youtube API

I have an iframe youtube video that i want to play and pause by using buttons, this is what i have so far but it doesn't seem to be working, can anyone let me know what errors I've made.

<body>



<div class="youtubePlayer" id="youtubePlayer">
<iframe id="videoPlayer" width="340" height="200"      src="https://www.youtube.com/embed/-0oZNWif_jk?list=PLD0qnaHPys3v_j-yGcnA3JJoTCFz_aK7s?enablejsapi=1&html5=1" frameborder="0" allowfullscreen>  </iframe>
</div>


<button id="play-btn">Play</button>
<button id="stop-btn">Stop</button>


<script>



var videoPlayer;

function onYouTubePlayerAPIReady() {
  videoPlayer = new YT.Player('videoPlayer', {
      events: {
          //calls function when player is ready
        'onReady': onPlayerReady
        }
      });
}

function onPlayerReady(event) {
    //bind
    var playButton = document.getElementById("play-btn");
    playButton.addEventListener("click", function() {
        videoPlayer.playVideo();    
    });

    var pauseButton = document.getElementById("stop-btn");
    pauseButton.addEventListener("click", function() {
        player.pauseVideo();
    });
}


var tag = document.createElement('script');
tag.src = "//www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);


</script>

</body>

Upvotes: 0

Views: 866

Answers (1)

AnuJa_
AnuJa_

Reputation: 11

it should be videoPlayer.pauseVideo();

Upvotes: 1

Related Questions