PageUp/PageDown buttons

Add semi-transparent PageUp/PageDown buttons to the right of every page. Useful when reading web pages on e-ink screens.

目前為 2023-02-22 提交的版本,檢視 最新版本

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         PageUp/PageDown buttons
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Add semi-transparent PageUp/PageDown buttons to the right of every page. Useful when reading web pages on e-ink screens.
// @author       xiaq
// @match        *://*/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
// @grant        none
// @license      BSD 2-clause
// ==/UserScript==

(function() {
    'use strict';

    const container = document.createElement('div');
    setStyle(container, {
        position: 'fixed', right: '8px', top: 'calc(50% - 48px)',
        display: 'flex', 'flex-direction': 'column',
        opacity: '0.5',
    })

    const buttonStyle = {
        width: '48px', height: '48px', 'font-size': '32px', border: '1px solid black',
        display: 'flex', 'align-items': 'center', 'justify-content': 'center',
    };
    const scrollFactor = 0.8;

    const pageUp = document.createElement('button');
    pageUp.innerText = '▲';
    setStyle(pageUp, buttonStyle);
    pageUp.onclick = () => { window.scrollBy(0, -scrollFactor * window.innerHeight) };

    const pageDown = document.createElement('button');
    pageDown.innerText = '▼';
    setStyle(pageDown, buttonStyle);
    pageDown.onclick = () => { window.scrollBy(0, scrollFactor * window.innerHeight) };

    container.appendChild(pageUp);
    container.appendChild(pageDown);
    document.body.appendChild(container);

    function setStyle(elem, obj) {
        elem.style = Object.entries(obj).map(([k, v]) => k+':'+v).join(';');
    }
})();