Skip to content

Instantly share code, notes, and snippets.

@gunderson

gunderson/YouTube de letterbox 21:9 video bookmarklet

Last active October 25, 2019 19:54
Show Gist options
  • Save gunderson/28be47adc3f9c9e93554f13f0bb0923e to your computer and use it in GitHub Desktop.
Save gunderson/28be47adc3f9c9e93554f13f0bb0923e to your computer and use it in GitHub Desktop.
Download ZIP
Raw
YouTube de letterbox 21:9 video bookmarklet
javascript:(function()%7Bfunction%20fill219()%7Blet%20container%20%3D%20document.querySelector('.html5-video-container')%3Bcontainer.style.position%20%3D%20'absolute'%3Bcontainer.style.top%20%3D%20'0'%3Bcontainer.style.bottom%20%3D%20'0'%3Bcontainer.style.left%20%3D%20'0'%3Bcontainer.style.right%20%3D%20'0'%3Bcontainer.style.margin%20%3D%20'auto'%3Blet%20video%20%3D%20document.querySelector('.html5-main-video')%3Bvideo.style.width%20%3D%20null%3Bvideo.style.height%20%3D%20null%3Bvideo.style.width%20%3D%20null%3Bvideo.style.top%20%3D%20null%3Bvideo.style.left%20%3D%20null%3Bvideo.style.objectFit%20%3D%20'cover'%3B%7Dfill219()%3Bwindow.addEventListener('resize'%2C%20fill219)%3Bwindow.addEventListener('fullscreenchange'%2C%20fill219)%7D)()
@gunderson
Copy link
Author

gunderson commented Oct 25, 2019 •
edited
Loading 

function fill219(){
    let container = document.querySelector('.html5-video-container');
    container.style.position = 'absolute';
    container.style.top = '0';
    container.style.bottom = '0';
    container.style.left = '0';
    container.style.right = '0';
    container.style.margin = 'auto';
    let video = document.querySelector('.html5-main-video');

    video.style.width = null;
    video.style.height = null;
    video.style.width = null;
    video.style.top = null;
    video.style.left = null;

    video.style.objectFit = 'cover';
}
fill219();
window.addEventListener('resize', fill219);
window.addEventListener('fullscreenchange', fill219);`

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