-
-
Save cferdinandi/9044694 to your computer and use it in GitHub Desktop.
/** | |
* 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(); | |
} | |
}; |
It worked great.
Additionally I used it inside a pair of JQuery events (a modal close close button click and on the background overlay click).
@Luminicus This outta do it.
/** * Stop all iframes or HTML5 <video>'s from playing */ var stopVideos = function () { var videos = document.querySelectorAll('iframe, video'); Array.prototype.forEach.call(videos, function (video) { if (video.tagName.toLowerCase() === 'video') { video.pause(); } else { var src = video.src; video.src = src; } }); };
Thanks man!
Hi all, is there a way to call the function when a YouTube or Vimeo or HTML5 video is clicked to play?
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
My updated version to stop all videos on page:
const stopVideos = () => { document.querySelectorAll('iframe').forEach(v => { v.src = v.src }); document.querySelectorAll('video').forEach(v => { v.pause() }); };
(I couldn't use the YouTube
postMessage
one because some of my YT videos were displayed in a nested iframe via embed.ly)
Excellent! Thumbs up! d.,.b
does this stop the related videos from showing on a live youtube stream playing on video js player?
Thanks for sharing!