Hide Scrollbar

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

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         Hide Scrollbar
// @icon         https://img.icons8.com/?size=96&id=1pCmONr8SqKT&format=png
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Hides scrollbars on most webpages for a cleaner look. May not work on all complex sites.
// @author       DuyNguyen2K6
// @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());
    */

})();