Greasy Fork

来自缓存

Greasy Fork is available in English.

YouTube Restore Scrollable Fullscreen

Restores scrollable fullscreen mode to show title, comments, likes, and related videos. Disables new UI's bottom recommendations.

当前为 2025-10-15 提交的版本，查看 最新版本。

// ==UserScript==
// @name         YouTube Restore Scrollable Fullscreen
// @namespace    burak-tools
// @version      1.8
// @description  Restores scrollable fullscreen mode to show title, comments, likes, and related videos. Disables new UI's bottom recommendations.
// @author       Waldoocs (https://x.com/Waldoocs) [https://github.com/Waldoocs](https://github.com/Waldoocs)
// @match        https://www.youtube.com/*
// @run-at       document-idle
// @grant        GM_addStyle
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    GM_addStyle(`
        ytd-app[fullscreen] {
            overflow: auto !important;
        }
        ytd-app[scrolling] {
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: calc((var(--ytd-app-fullerscreen-scrollbar-width) + 1px)*-1) !important;
            bottom: 0 !important;
            overflow-x: auto !important;
        }
        ytd-watch-flexy[fullscreen] #single-column-container.ytd-watch-flexy,
        ytd-watch-flexy[fullscreen] #columns.ytd-watch-flexy {
            display: flex !important;
        }

        /* Hide the fullscreen grid with recommended videos */
        .ytp-fullscreen-grid,
        .ytp-fullscreen-grid-main-content,
        .ytp-fullscreen-grid-stills-container,
        .ytp-modern-videowall-still,
        .ytp-fullscreen-grid-expand-button,
        .ytp-fullscreen-grid-hover-overlay {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
            height: 0 !important;
            max-height: 0 !important;
            overflow: hidden !important;
        }

        /* Completely disable grid scrolling CSS variables */
        .html5-video-player.ytp-grid-scrollable,
        .html5-video-player {
            --ytp-grid-scroll-percentage: 0 !important;
            --ytp-grid-peek-height: 0px !important;
        }

        /* Hide any fullscreen education panels and overlays */
        .ytp-fullerscreen-edu-panel,
        .ytp-cards-teaser,
        .ytp-cards-teaser-box,
        div[class*="fullerscreen"] {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
        }
    `);

    // JavaScript to detect and disable new UI scroll behavior
    function disableNewUIScroll() {
        const player = document.querySelector('.html5-video-player');

        if (player) {
            // Remove the grid scrollable class
            if (player.classList.contains('ytp-grid-scrollable')) {
                player.classList.remove('ytp-grid-scrollable');
            }

            // Force CSS variables to 0
            player.style.setProperty('--ytp-grid-scroll-percentage', '0', 'important');
            player.style.setProperty('--ytp-grid-peek-height', '0px', 'important');
        }

        // Remove fullscreen grid elements
        const gridElements = document.querySelectorAll('.ytp-fullscreen-grid, .ytp-fullscreen-grid-main-content, .ytp-fullscreen-grid-stills-container, .ytp-modern-videowall-still');
        gridElements.forEach(el => {
            el.style.display = 'none';
            el.style.visibility = 'hidden';
            el.remove();
        });

        // Remove fullscreen education panels
        const panels = document.querySelectorAll('.ytp-fullerscreen-edu-panel, .ytp-cards-teaser, div[class*="fullerscreen"]');
        panels.forEach(panel => {
            panel.style.display = 'none';
            panel.style.visibility = 'hidden';
            panel.remove();
        });
    }

    // Run immediately
    disableNewUIScroll();

    // Watch for DOM changes
    const observer = new MutationObserver(() => {
        disableNewUIScroll();
    });

    // Start observing the entire document
    observer.observe(document.documentElement, {
        childList: true,
        subtree: true,
        attributes: true,
        attributeFilter: ['class', 'style']
    });

    // Run periodically as backup
    setInterval(disableNewUIScroll, 300);

    // Intercept scroll events
    document.addEventListener('scroll', (e) => {
        disableNewUIScroll();
    }, true);

    // Prevent wheel events from triggering grid scroll
    document.addEventListener('wheel', (e) => {
        disableNewUIScroll();
    }, true);
})();