Hide Scrollbar

Hides scrollbars on most webpages for a cleaner look. May not work on all complex sites.

安裝腳本 ?

作者: -Duy-
今日安裝: 0
安裝總數: 3
評價: 0 0 0
版本: 1.0
建立日期: 2025-07-30
更新日期: 2025-07-30
尺寸: 2.4 KB
授權條款: 未知
腳本執行於: 所有網站

title: "Hide Web Scrollbars: A Cleaner Browse Experience!" author: "DuyNguyen2k6"

date: "July 30, 2025" # Update this date if needed

Hey everyone,

Are you tired of seeing scrollbars constantly cluttering your screen, taking away from the clean look of webpages? If so, I've got a neat and effective solution for you: a simple Userscript for Tampermonkey (or Greasemonkey, Violentmonkey)!

What does it do?

This Userscript automatically hides both vertical and horizontal scrollbars on most websites you visit. The goal is to provide a cleaner, less "cluttered" browser interface, helping you focus on the main content.

Key Features:

Automatic Operation: Install it once, and the script will automatically hide scrollbars on all supported pages.
Still Scrollable: Most importantly, even with the scrollbars hidden, you can still fully scroll pages using your mouse wheel, trackpad, or standard scrolling gestures.
Lightweight & Safe: The script is designed to be minimal, focusing solely on the scrollbar hiding function with the least possible conflict with webpages.

Important Notes:

Due to the diverse ways websites are built (especially complex ones like YouTube, Facebook, or large web applications...), this Userscript:

May not work perfectly: On some pages, scrollbars might still be visible.
Might affect scrolling: On a small number of pages, the scrolling functionality might be affected, especially if they use custom scroll systems or complex JavaScript.
Prioritizes Stability: This version prioritizes stability and minimal issues on regular websites, rather than trying to aggressively override every complex scenario (which can sometimes break page layouts).

How to Install (Tampermonkey Required):

Install Tampermonkey: If you don't have it already, install the Tampermonkey browser extension for your browser (available for Chrome, Firefox, Edge, etc.).
Create a New Userscript: Click the Tampermonkey icon in your browser's toolbar, then select "Create a new script...".
Paste the Code: Delete all the default content in the editor and paste the entire userscript code provided below.
Save: Press Ctrl + S (or Cmd + S on macOS) or save the script via Tampermonkey's menu.

After installation, reload your webpages to see the effect!

// ==UserScript==
// @name         Hide Scrollbar (Simple)
// @namespace    [http://tampermonkey.net/](http://tampermonkey.net/)
// @version      1.1
// @description  Automatically hides scrollbars on most webpages for a cleaner look.
// @description  This script uses basic CSS to hide browser scrollbars while retaining scrollability.
// @description  IMPORTANT NOTES:
// @description  - May not work or allow scrolling on some complex sites (e.g., YouTube, Facebook) due to custom scrollbars or special DOM structures.
// @description  - Focuses on stability and minimal issues on regular websites.
// @author       Your Name
// @match        *://*/*
// @grant        none
// @run-at       document-idle
// ==/UserScript==

(function() {
    'use strict';

    const STYLE_ID = 'userscript-hide-scrollbar-style-simple';

    // Function to inject the basic CSS rule for scrollbar hiding
    function applyHideScrollbarCss() {
        let styleTag = document.getElementById(STYLE_ID);

        if (!styleTag) {
            styleTag = document.createElement('style');
            styleTag.id = STYLE_ID;
            styleTag.textContent = `
                /* Hide scrollbar for WebKit browsers (Chrome, Safari, Edge, Opera) */
                ::-webkit-scrollbar {
                  width: 0 !important;
                  height: 0 !important;
                  background: transparent !important;
                }

                /* Hide scrollbar for Firefox */
                html, body {
                  scrollbar-width: none !important;
                }

                /* Hide scrollbar for Internet Explorer and Edge Legacy */
                html, body {
                  -ms-overflow-style: none !important;
                }
            `;
            document.head.appendChild(styleTag);
        }
    }

    // Function to remove the CSS rule (not strictly needed for this simple version, but good practice)
    function removeHideScrollbarCss() {
        const styleTag = document.getElementById(STYLE_ID);
        if (styleTag) {
            styleTag.remove();
        }
    }

    // Apply the CSS on page load
    applyHideScrollbarCss();

    // Optionally, use a MutationObserver if you find scrollbars reappearing frequently
    // This part is commented out to keep it simpler and avoid potential issues,
    // but you can uncomment it if needed.
    /*
    const observer = new MutationObserver((mutations) => {
        if (!document.getElementById(STYLE_ID)) {
            applyHideScrollbarCss();
        }
    });
    observer.observe(document.body, { childList: true, subtree: true, attributes: true });
    observer.observe(document.documentElement, { attributes: true });
    window.addEventListener('unload', () => observer.disconnect());
    */

})();