Greasy Fork

Greasy Fork is available in English.

Font Size Controller

Control the font size of any webpage with a slider.

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

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==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
    }
});