Stop YouTube video AND start timeline with one click on an image

Using JavaScript with Hype
,
4

Hi Jonathan,

I spoke too soon. I'm able to get one video to stop when hitting the close button. If I use this method on the other videos in the scene, they don't stop. I figured this was due to an ID conflict. So I changed the video iframe ID to be unique for each one, as well as changed other variable names to be unique. However, it still will only stop one of the videos and no others.

Here's an example of the code:

<iframe id="videoPlayerAnkPF" width="420" height="237" src="https://www.youtube.com/embed/sCgatB5ojQ4?enablejsapi=1&amp;rel=0&amp;showinfo=0&amp;autohide=1" frameborder="0" style="border: solid 4px #37474F"></iframe>

<script type="text/javascript">
  var tag = document.createElement('script');
  tag.id = 'iframe-videoAnkPF';
  tag.src = 'https://www.youtube.com/iframe_api';
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  var playerAnkPF;
  function onYouTubeIframeAPIReady() {
    playerAnkPF = new YT.Player('videoPlayerAnkPF', {
    });
  }  
</script>

In the above script, the iframe id is unique, the script tag id is unique, the "player" variable name is unique, and the "onYouTubeIframeAPIReady" function is calling the unique iframe ID.

When doing this for two videos, only one will work at a time. As soon as I remove the above script for one of the videos, the other that used to not work, now works without any change to the code.

Any ideas how to get this to work on multiple videos within the scene?