I need some help with Youtube API and embeded videos. I want to stop all iframe videos (here i have taken only 3, but there are several videos)running on the current page when a new youtube video is clicked. At one point of time, only one iframe youtube video should run. I have gone thruogh documentation [https://developers.google.com/youtube/js_api_reference][1] and was able to write till here...
Updated:
<!DOCTYPE html><html><head><title></title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><script type="text/javascript" src="http://www.youtube.com/player_api"></script><script type="text/javascript"> var player; function onYouTubeIframeAPIReady() { player = new YT.Player('player', { events: {'onReady': onPlayerReady,'onStateChange': onPlayerStateChange } }); } var done = false; function onPlayerStateChange(event) { if (event.data == YT.PlayerState.PLAYING && !done) { alert("hi5"); player1.stopVideo(); player2.stopVideo(); done = true; } }</script></head><body><div>TODO write content</div><ul class="image-grid" id="list"> <li><iframe id="player" width="385" height="230" src="http://www.youtube.com/embed/erDxb4IkgjM?rel=0&wmode=Opaque&enablejsapi=1;showinfo=0;controls=0" frameborder="0" allowfullscreen></iframe> </li><li><iframe id="player1" width="385" height="230" src="http://www.youtube.com/embed/wSrA5iQGlDc?rel=0&wmode=Opaque&enablejsapi=1;showinfo=0;controls=0" frameborder="0" allowfullscreen></iframe></li><li><iframe id="player2" width="385" height="230" src="http://www.youtube.com/embed/c7b_WLkztXc?rel=0&wmode=Opaque&enablejsapi=1;showinfo=0;controls=0" frameborder="0" allowfullscreen></iframe></li></ul></body></html>UPDATED
- onStateChange event is not getting triggered(working)
- In this example i have 3 videos, in reality it has more videos instead of writing onPlayerStateChange for each video..is it possible to use an array for all the videos..and in the function onPlayerStateChange, to write player[].stopVideo() and this.playvideo()..something of this sort..(help required)please see this fiddle http://jsfiddle.net/LakshmiV/kn5Sf/Please help.