Bookmarklet to toggle visibility of fixed overlays on screen

README.md

This is a browser bookmarklet which hides annoying overlays on web pages that are positioned at fixed locations on the page and don't move as you scroll. This is particularly useful for smaller desktop screens (I have a 13" MacBook Pro). Examples include:

• Cookie banners
• Banners at the top and bottom of the page on Medium-powered blogs telling you to sign in
• Navigation bars on web pages that don't scroll out of the way when you scroll down

Usage

1. Create a new bookmark
2. Copy the content of toggle-fixed-element.js
3. Edit the bookmark and replace the URL with the copied content
4. On any page which has annoying overlays, activate the bookmarklet to hide or show overlays

toggle-fixed-elements.js

javascript:
var isFixedOverlay = element => getComputedStyle(element).position.startsWith('fixed');
var overlays = Array.from(document.querySelectorAll('*')).filter(isFixedOverlay);
overlays.forEach(el => el.style.visibility = el.style.visibility === 'hidden' ? 'visible' : 'hidden');