☰

Font Size Controller

Control the font size of any webpage with a slider.

当前为 2023-11-06 提交的版本，查看 最新版本。

// ==UserScript==
// @name     Font Size Controller
// @description   Control the font size of any webpage with a slider.
// @version  1.0.1
// @namespace https://github.com/amazing-fish
// @grant    GM_setValue
// @grant    GM_getValue
// @license  MIT
// @include  *
// ==/UserScript==

window.addEventListener('load', function() {
    // Create slider element
    var slider = document.createElement('input');
    slider.type = 'range';
    slider.min = '10';
    slider.max = '32';
    slider.value = GM_getValue("fontSize", '16');  // Get the stored font size, if any
    slider.id = 'fontSlider';
    slider.style = 'position: fixed; top: 0; left: 0; z-index: 9999';  // Position the slider at top left

    // Create font size display element
    var fontSizeDisplay = document.createElement('div');
    fontSizeDisplay.id = 'fontSizeDisplay';
    fontSizeDisplay.textContent = 'Font Size: ' + slider.value + 'px';
    fontSizeDisplay.style = 'position: fixed; top: 3px; left: 140px; z-index: 9999; font-size: 10px';  // Position the display next to the slider

    // Append slider and display to body
    document.body.appendChild(slider);
    document.body.appendChild(fontSizeDisplay);

    // Function to update font sizes
    function updateFontSizes(size) {
        var all = document.getElementsByTagName("*");
        for (var i=0, max=all.length; i < max; i++) {
            if (all[i].id !== 'fontSizeDisplay') {
                all[i].style.fontSize = size + "px";
            }
        }
    }

    // Update the font sizes immediately upon loading the page
    updateFontSizes(slider.value);

    // Event listener for slider
    slider.oninput = function() {
        fontSizeDisplay.textContent = 'Font Size: ' + this.value + 'px';  // Update the display
        updateFontSizes(this.value);  // Update the font sizes
        GM_setValue("fontSize", this.value);  // Store the font size
    }
});