Toggle distraction-free mode
A one-click action that turns reading mode on and off: hides distractions and narrows and enlarges content.
Code to copy
(function () {
var ID = 'jz-distraction-free-style';
var existing = document.getElementById(ID);
if (existing) {
existing.remove();
return;
}
var style = document.createElement('style');
style.id = ID;
style.textContent =
'aside,.sidebar,#sidebar,[role="complementary"],' +
'header nav,.ad,.ads,[id*="comment"],.related-posts,' +
'.newsletter,.social-share{display:none !important;}' +
'article,main,.post,.entry-content{' +
'max-width:70ch !important;margin:0 auto !important;' +
'font-size:1.1rem !important;line-height:1.75 !important;}';
document.head.appendChild(style);
})();How to use this example
- Copy the code with the button above.
- Install JustZix (2 minutes) and open the extension on the target page.
- Add a new rule matching that page.
- Enable the action panel, add a button in the Actions tab and paste the code into it — run it with one click.
Rate this example
No ratings yet — be the first.