Autoplay Vimeo video on click in modal

Question

How can I autoplay Vimeo video I have in iframe in bootstrap modal window on image click?

I've done this before using YouTube JavaScript API but have no idea how this works with Vimeo. I see they also have some API but could use some pointers how this would work.

First tried appending ?autoplay=1 to iframe video src attribute in modal on image click using jQuery but that didn't work.

When the modal hides before video is done I also need to stop() the video from running in background.

Any pointers in the right direction greatly helpful!!! Thank you!

Answer 1

I tried the appending the iframe's source with '?autoplay=1' like you'd mentioned:

$("iframe")[0].src += "?autoplay=1";

Seems to work for me. I believe the iframe also needs to include 'allow="autoplay"' though for example:

<iframe src="YOURVIDEOURL" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="autoplay">

To stop the video on click - I imagine appending the src, removing '?autoplay=1' would then also work.

Hope this helps somebody!