Autoplay / pause Youtube iframe

Question

I currently have this code: http://jsfiddle.net/D5EMp/25/

This code fades in/out a div with a YouTube embed within it. Currently when you click to watch the showreel it doesn't autoplay. I'd like it to autoplay when the 'Watch showreel' button is clicked.

Also, if the video is playing and you click the 'X Hide' button the wrapper hides the video but the video keeps on playing. I'd like to pause the video when the 'X Hide' button is pressed.

How can I edit my existing code to get the functionality I want?

Answer 1

I don't think you can send play/pause commands to the iframe. What you can do though, is include it when you want it to play (with the autoplay option) and remove it when you want it to stop. Try this: http://jsfiddle.net/D5EMp/26/ (I can't confirm 100% that it works as youtube is blocked for me right now)

Answer 2

Everything you'd like to do is fully supported; just use the iframe Player API:

https://developers.google.com/youtube/iframe_api_reference