0

side question to: Make youtube video fullscreen using iframe and javascript API

i have a side question:

the codepen code of 'Alkindus' works great thanks!

(i hided the video with 'height:0;' and linked it to an url)

On escape the video hides but keeps playing, and i do not find how to pauze the video on 'escape'

tried something like:

window.addEventListener("keydown", function (event) {
  if (event.defaultPrevented) {
    return; // Do nothing if the event was already processed
  }
  if(event.key === "Escape") { 
  //alert('escape');
  player.stopVideo();
  }

  event.preventDefault();
}, true);

it triggers my escape, but while in the video i have to doubletap 'escape'

maybe some eventlistener that is triggered after changed state of fullscreen? or some kind of callback. Anyone has an idea in what direction i need to search?

1 Answers1

0

solution found: YouTube Player API detect fullscreen exit

document.addEventListener("fullscreenchange", function() {
  if (!document.fullscreenElement) player.stopVideo();
}, false);

document.addEventListener("msfullscreenchange", function() {
  if (!document.msFullscreenElement) player.stopVideo();
}, false);

document.addEventListener("mozfullscreenchange", function() {
  if (!document.mozFullScreen) player.stopVideo();
}, false);

document.addEventListener("webkitfullscreenchange", function() {
  if (!document.webkitIsFullScreen) player.stopVideo();
}, false);