Font Size Bookmarklet

README.md

Font Size Bookmarklet

Code

javascript:(function(){var getFontSize=function(el){return parseFloat(getComputedStyle(el,null)['font-size']);};document.addEventListener('wheel',function(e){if(!e.altKey)return;e.preventDefault();var el=e.target;var parent=el.parentElement;var size=getFontSize(el);while(parent&&size===getFontSize(parent)){el.style.fontSize='inherit';el=parent;parent=parent.parentElement;}if(e.wheelDelta>0){size+=1;}else{size-=1;}el.style.fontSize=size+'px';});}());

Use

Run the bookmarklet on a site. Hold down the alt key while moving the wheel mouse over some text.

font-size-bookmarklet.js

(function () {
    'use strict';

    var getFontSize = function (el) {
        return parseFloat(getComputedStyle(el, null)['font-size']);
    };

    document.addEventListener('wheel', function (e) {
        if (!e.altKey) return;
        e.preventDefault();
        var el = e.target;
        var parent = el.parentElement;
        var size = getFontSize(el);
        while (parent && size === getFontSize(parent)) {
            el.style.fontSize = 'inherit';
            el = parent;
            parent = parent.parentElement;
        }
        if (e.wheelDelta > 0) {
            size += 1;
        } else {
            size -= 1;
        }
        console.log(size);
        el.style.fontSize = size + 'px';
    });
}());