☰

YouTube Fullscreen Scroll Disabler

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

  1. // ==UserScript==
  2. // @name         YouTube Fullscreen Scroll Disabler
  3. // @namespace    https://youtube.com
  4. // @version      1.0.1
  5. // @description  Disable scrolling when YouTube is in fullscreen mode and hide scrollbar.
  6. // @author       Lolen10
  7. // @match        *://www.youtube.com/*
  8. // @icon         https://www.google.com/s2/favicons?domain=youtube.com
  9. // @grant        none
  10. // @license      GNU GPLv3
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     let hiddenElements = [];
  17.  
  18.     // Check for fullscreen change events
  19.     document.addEventListener('fullscreenchange', toggleScrollAndContent);
  20.     document.addEventListener('webkitfullscreenchange', toggleScrollAndContent); // For older browsers
  21.     document.addEventListener('mozfullscreenchange', toggleScrollAndContent); // For Firefox
  22.  
  23.     // Disable scrolling and remove content when in fullscreen
  24.     function toggleScrollAndContent() {
  25.         if (isFullScreen()) {
  26.             disableScroll();
  27.             removeContentBelowContainer();
  28.         } else {
  29.             enableScroll();
  30.             restoreContentBelowContainer();
  31.         }
  32.     }
  33.  
  34.     // Check if the document is in fullscreen mode
  35.     function isFullScreen() {
  36.         return document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement;
  37.     }
  38.  
  39.     // Function to disable scrolling with the scrollwheel
  40.     function disableScroll() {
  41.         window.addEventListener('wheel', preventScroll, { passive: false }); // Disable mouse scroll
  42.     }
  43.  
  44.     // Function to enable scrolling with the scrollwheel
  45.     function enableScroll() {
  46.         window.removeEventListener('wheel', preventScroll, { passive: false }); // Re-enable mouse scroll
  47.     }
  48.  
  49.     // Prevent the default scroll action
  50.     function preventScroll(e) {
  51.         e.preventDefault();
  52.     }
  53.  
  54.     // Function to remove all content below the video-player
  55.     function removeContentBelowContainer() {
  56.         const container = document.getElementById('single-column-container');
  57.         if (container) {
  58.             let nextSibling = container.nextElementSibling;
  59.  
  60.             // Loop through all next sibling elements and hide them
  61.             while (nextSibling) {
  62.                 hiddenElements.push(nextSibling); // Save hidden elements
  63.                 nextSibling.style.display = 'none'; // Hide the element
  64.                 nextSibling = nextSibling.nextElementSibling;
  65.             }
  66.         }
  67.     }
  68.  
  69.     // Function to restore content that was hidden when exiting fullscreen-mode
  70.     function restoreContentBelowContainer() {
  71.         hiddenElements.forEach(element => {
  72.             element.style.display = ''; // Reset the display property to show them again
  73.         });
  74.         hiddenElements = []; // Clear the list after restoring
  75.     }
  76.  
  77. })();