Skip to content

Instantly share code, notes, and snippets.

@cuth
Last active May 20, 2022 22:06
Show Gist options
  • Save cuth/01359c29f73065bc0eb8 to your computer and use it in GitHub Desktop.
Save cuth/01359c29f73065bc0eb8 to your computer and use it in GitHub Desktop.
Font Size Bookmarklet

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.

(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';
});
}());
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment