☰

YouTube Fullscreen Scroll Disabler

Disable scrolling when YouTube is in fullscreen mode and hide scrollbar.

// ==UserScript==
// @name         YouTube Fullscreen Scroll Disabler
// @namespace    https://youtube.com
// @version      1.0.1
// @description  Disable scrolling when YouTube is in fullscreen mode and hide scrollbar.
// @author       Lolen10
// @match        *://www.youtube.com/*
// @icon         https://www.google.com/s2/favicons?domain=youtube.com
// @grant        none
// @license      GNU GPLv3
// ==/UserScript==

(function() {
    'use strict';

    let hiddenElements = [];

    // Check for fullscreen change events
    document.addEventListener('fullscreenchange', toggleScrollAndContent);
    document.addEventListener('webkitfullscreenchange', toggleScrollAndContent); // For older browsers
    document.addEventListener('mozfullscreenchange', toggleScrollAndContent); // For Firefox

    // Disable scrolling and remove content when in fullscreen
    function toggleScrollAndContent() {
        if (isFullScreen()) {
            disableScroll();
            removeContentBelowContainer();
        } else {
            enableScroll();
            restoreContentBelowContainer();
        }
    }

    // Check if the document is in fullscreen mode
    function isFullScreen() {
        return document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement;
    }

    // Function to disable scrolling with the scrollwheel
    function disableScroll() {
        window.addEventListener('wheel', preventScroll, { passive: false }); // Disable mouse scroll
    }

    // Function to enable scrolling with the scrollwheel
    function enableScroll() {
        window.removeEventListener('wheel', preventScroll, { passive: false }); // Re-enable mouse scroll
    }

    // Prevent the default scroll action
    function preventScroll(e) {
        e.preventDefault();
    }

    // Function to remove all content below the video-player
    function removeContentBelowContainer() {
        const container = document.getElementById('single-column-container');
        if (container) {
            let nextSibling = container.nextElementSibling;

            // Loop through all next sibling elements and hide them
            while (nextSibling) {
                hiddenElements.push(nextSibling); // Save hidden elements
                nextSibling.style.display = 'none'; // Hide the element
                nextSibling = nextSibling.nextElementSibling;
            }
        }
    }

    // Function to restore content that was hidden when exiting fullscreen-mode
    function restoreContentBelowContainer() {
        hiddenElements.forEach(element => {
            element.style.display = ''; // Reset the display property to show them again
        });
        hiddenElements = []; // Clear the list after restoring
    }

})();