How to stop a Vimeo video with jQuery

Question

When I hide a YouTube video, it stops playing. However, this is not the case for Vimeo videos. Is there another way to stop a Vimeo video?

Answer 1

Using the Vimeo JavaScript API, it can be done with:

player.unload()

https://github.com/vimeo/player.js#unload-promisevoid-error

Answer 2

First, add an ID to your iFrame. Then add this to your javascript close window click function:

var $frame = $('iframe#yourIframeId');

// saves the current iframe source
var vidsrc = $frame.attr('src');

// sets the source to nothing, stopping the video
$frame.attr('src',''); 

// sets it back to the correct link so that it reloads immediately on the next window open
$frame.attr('src', vidsrc);

Answer 3

I recently needed to pause a Vimeo video that was inside a Bootstrap modal when the modal was closed.

The Vimeo video was embedded in an iframe.

This is what worked for me:

$("#my-bootstrap-modal").on('hidden.bs.modal', function (e) {
    var div = document.getElementById("my-bootstrap-modal");
    var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
    iframe.postMessage('{"method":"pause"}', '*');
});

Answer 4

To restore the SRC attribute, use the following before clearing:

var source = $('iframe#yourVideoId').attr('src');

Next, SRC attribute clear:

$('iframe#yourVideoId').attr('src', '');

Callback previous SRC attribute:

$('iframe#yourVideoId').attr('src', source);

Answer 5

    var vidUrl = $("iframe#video-frame").attr('src');


    //Basically stops and starts the video on modal open/close
    $('#video').on('hidden.bs.modal', function (e) {
        $("iframe#video-frame").attr('src','');
    });

    $('#video').on('show.bs.modal', function (e) {
        $("iframe#video-frame").attr('src', vidUrl);
    })

Answer 6

Another answer along the lines of David's...you can use jQuery to clear the SRC attribute of the iFrame.

$('iframe#targetID').attr('src','');

I'm using this with a Vimeo video and a lightbox effect. When the lightbox is triggered again, I add the video URL back to the iFrame SRC before showing it.