Reading Ruler

A firefox addon that adds a horizontal translucent bar that follows the cursor. A reading aid for pages with wiiiiiiide paragraphs.

目前为 2018-09-22 提交的版本。查看 最新版本

// ==UserScript==
// @name         Reading Ruler
// @namespace    https://old.reddit.com/r/SomebodyMakeThis/comments/9huwbw/smt_a_firefox_addon_that_adds_a_horizontal/
// @version      0.1
// @description  A firefox addon that adds a horizontal translucent bar that follows the cursor. A reading aid for pages with wiiiiiiide paragraphs.
// @author       /r/defproc
// @match        */*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    var bar = document.createElement("div");
    var styles = {
        left: 0,
        right: 0,
        height: "1.25em",
        backgroundColor: "#00ff0012",
        position: "absolute",
        transform: "translateY(-50%)",
        display: "none",
        pointerEvents: "none",
        transition: "120ms height"
    };
    Object.keys(styles).forEach(function(k){ bar.style[k] = styles[k] });
    document.body.addEventListener("mousemove", function(ev){
        bar.style.top = ev.clientY + "px";
        if(visible){
            var over = document.elementFromPoint(ev.clientX, ev.clientY);
            bar.style.height = window.getComputedStyle(over).getPropertyValue("line-height");
        }
    });
    var visible = false;
    var toggle = function(){
        visible = !visible;
        document.body.appendChild(bar);
        bar.style.display = visible ? "block" : "none";
    };
    window.addEventListener("keypress", function(ev){
        if(ev.ctrlKey && ev.altKey) toggle();
    });

})();