Greasemonkey script to make Fixed Positioned Elements Static

Question

I find elements on a web page that have been positioned fixed to be in my way frequently. I'd like to find a way to disable position: fixed CSS rules in any web site that I visit.

I wrote a userscript (Firefox, Greasemonkey) that scans every node in the document and figures out if it has a computed style position fixed, then overrides that to be static.

Is there a better way to accomplish my goal?

This is the script I wrote, I've narrowed it to just divs for now:

Array.forEach(
    document.querySelectorAll("div")
    ,function(el) {
        if (window.getComputedStyle(el).position === 'fixed') {
            el.style.position = 'static';
        }
    }
);

Purely just wondering why you want to do this? Wouldn't it break some styling that "relies" on fixed positioning? I know it's unrelated to the question, I'm just wondering — Ian, Dec 04 '12 at 04:30
I've gotten used to zooming a page on my desktop until the main content fills the window, like viewing a page on my cell phone. Perhaps I'm old. Fixed position elements frequently overlay the content. I think that fixed elements are generally divorced from page content, so I don't expect too much breakage. — Rob, Dec 04 '12 at 04:37
for(var a=document.querySelectorAll("*"),i=0,e;e=a[i];i++)"fixed"==getComputedStyle(e).position&&(e.style.position="static") [-Jeremy Ashkenas](https://twitter.com/jashkenas/status/534741312525070337) — PHearst, Nov 18 '14 at 22:07
The previous comment seems to contain zero-width spaces, for some reason, so it's not copy-pastable (though it does work). — aplaice, Mar 14 '17 at 20:06
They seem to be inserted by stackoverflow as a means of preventing overflowing lines, since creating a fresh comment with the correct content (with no hidden spaces) still led to the result containing the hidden spaces. Using code tags did not help. — aplaice, Mar 14 '17 at 20:20
Cross-referencing similar questions: http://stackoverflow.com/questions/26664285/how-do-i-disable-positionfixed-in-web-pages https://superuser.com/a/902531/580566 — aplaice, Mar 18 '17 at 19:42

score 5 · Accepted Answer · answered Dec 04 '12 at 05:02

If your Greasemonkey script works, it is probably the most cost effective way to eliminate fixed-positioned styling.

Some alternatives that require much more effort but will use less CPU/memory per page:

Write an Add-on that:
1. Deletes CSS style rules as they are loaded. (Greasemonkey cannot always do this because of cross-domain issues.)
2. Uses Mutation Observers to intercept javascript attempts to set position: fixed.
Fork and compile your own version of Firefox that ignores position: fixed. You'd probably want this controlled by both a "blacklist" and a "whitelist".

Greasemonkey script to make Fixed Positioned Elements Static

1 Answers1

Linked