Skip to content

Instantly share code, notes, and snippets.

@cferdinandi

cferdinandi/stop-video.js

Last active February 15, 2024 17:03
Show Gist options
  • Save cferdinandi/9044694 to your computer and use it in GitHub Desktop.
Save cferdinandi/9044694 to your computer and use it in GitHub Desktop.
Download ZIP
A simple method to stop YouTube, Vimeo, and HTML5 videos from playing.
Raw
stop-video.js
/**
* Stop an iframe or HTML5 <video> from playing
* @param {Element} element The element that contains the video
*/
var stopVideo = function ( element ) {
var iframe = element.querySelector( 'iframe');
var video = element.querySelector( 'video' );
if ( iframe ) {
var iframeSrc = iframe.src;
iframe.src = iframeSrc;
}
if ( video ) {
video.pause();
}
};
@vistree
Copy link

vistree commented May 10, 2023

Hi all, is there a way to call the function when a YouTube or Vimeo or HTML5 video is clicked to play?

@Fezzito
Copy link

Fezzito commented Jul 26, 2023

i tried the two answers and this turnt out to be the best one, in the first one you might enconter the problem of " var iframe = element.querySelector( 'iframe'); is not a function", dont know if it was because of my tsconfig or what.
Also, if you must call the function in several components (wich is my case) you should consider switching var stopVideos to const stopVideos an all the following var to let to avoid scope problems

that being said, amazing approach man, well done

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment