您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Force YouTube to show 6 videos per row and fix padding
// ==UserScript== // @name Fix Youtube thumbnail padding for real // @namespace http://tampermonkey.net/ // @version 1.4 // @description Force YouTube to show 6 videos per row and fix padding // @author Kalakaua // @match https://www.youtube.com/* // @grant none // @license MIT // ==/UserScript== (function() { 'use strict'; // Inject custom CSS to force 6 videos per row const injectCSS = () => { const css = ` /* Target the correct parent container for the grid */ ytd-rich-grid-renderer #contents.ytd-rich-grid-renderer { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; /* 6 columns */ gap: 8px !important; /* Adjust the gap between thumbnails */ padding-right: 0 !important; /* Remove any default padding */ } /* Ensure each video item takes up equal space */ ytd-rich-item-renderer { width: 100% !important; max-width: 100% !important; /* Prevent overflow */ margin-left: 0 !important; /* Reset default margin */ } /* Adjust the thumbnail image size */ ytd-rich-grid-media #thumbnail { width: 100% !important; height: auto !important; } /* Ensure the title and metadata don't overflow */ ytd-rich-grid-media #meta { max-width: 100% !important; } `; const style = document.createElement('style'); style.innerHTML = css; document.head.appendChild(style); }; // Function to check if an element is visible function isVisible(el) { return el.offsetWidth > 0 && el.offsetHeight > 0 && window.getComputedStyle(el).visibility !== 'hidden'; } // Function to update margin-left in the specified pattern function updateMarginLeft() { const elements = document.querySelectorAll('ytd-rich-item-renderer'); let activeCount = 0; // Adjust the modulus value based on the number of thumbnails per row const thumbnailsPerRow = 6; // 6 thumbnails per row elements.forEach(el => { if (isVisible(el)) { el.style.marginLeft = (activeCount % thumbnailsPerRow === 0) ? '24px' : '8px'; activeCount++; } }); } // Run the CSS injection and update margins initially injectCSS(); updateMarginLeft(); // Observe changes in the DOM to reapply the CSS and margins const observer = new MutationObserver(() => { injectCSS(); updateMarginLeft(); }); observer.observe(document.body, { childList: true, subtree: true }); // Also listen for page visibility changes document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'visible') { injectCSS(); updateMarginLeft(); } }); })();