Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
GreaseMonkey script to remove "position: fixed" from webpages
// ==UserScript==
// @name unfix-all-the-toolbars
// @description Removes "position: fixed" style from elements, unfixing "toolbars" and the such.
// @namespace
// @include *
// @version 1
// @grant none
// ==/UserScript==
Based on
2015-02-17: Original version.
2016-05-01: Added the styleWidth threshold heuristic.
The big problem here is we want to avoid unfixing *all* "position: fixed"
elements, because some of them are fake popup windows which become quite
unusable if you change them to "position: static". So we need some heuristic
to distinguish "legitimate" fixed elements from gratuitous ones like navbars.
function numPixels(str) {
if (str.endsWith("px"))
return Number(str.slice(0, -2));
else {
console.log("unfix-all-the-toolbars: Computed width is not in pixels! " + width);
return null;
function unfixAll() {
var bodyStyle = window.getComputedStyle(document.body);
var pageWidth = numPixels(bodyStyle.width);
var pageHeight= numPixels(bodyStyle.height);
var toolbarWidthThreshold = 0.8 * pageWidth;
/* Assorted selection of likely fixed elements, to avoid querying all elements */
document.querySelectorAll("h1, h2, ul, ol, li, div, nav, header, footer"),
function (el) {
var style = window.getComputedStyle(el);
if (style.position === "fixed") {
/* Avoid unfixing JavaScript popus like Twitter's "confirm retweet" window */
if (style.display === "none" || style.visibility === "hidden") return;
if (numPixels(style.width) < toolbarWidthThreshold) return;
// Try to select the best replacement for 'fixed'. Still breaks lots of things, though.
if (numPixels(style.bottom) === 0 && numPixels( > 0) = "static"; // Use static for footers.
else = "absolute";
window.addEventListener("load", unfixAll);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment