Question

I am trying to do something really simple. I have a bootstrap modal window where I am putting a youtube iframe video like this:

<iframe id='youtube-player' width="560" height="315" src="http://www.youtube.com/embed/AYPePO0oa_o?rel=0&wmode=transparent" frameborder="0" allowfullscreen></iframe>

I’d like to use bootstrap’s close class to just top the video. I have this but not working (obviously)

$('.close').on('click', function(){
  alert('here you are');
  $('#youtube-player').stopVideo();
});

This should seem like it should be really simple but I’m not sure what I should be doing? Any help would be appreciated.

thx in advance,

jonathan

Answer 1

I believe it has something to do with the way you embed the iframe to start with.

Have a look at this question its not exactly the same but it’s similar: Stop all YouTube iframe embeds from playing?

And this is the You Tube developers reference from Google on how to embed iframes if you want to use the controls: https://developers.google.com/youtube/iframe_api_reference

That should have all the info you need.