Kill-sticky, a bookmarklet to remove sticky elements and restore scrolling

395 点作者 ivank超过 2 年前

30 条评论

joosters超过 2 年前

This is my most useful bookmark, I use it everywhere (it's even practical on an iphone)So many sites have a top banner that disappears as you scroll down a page, but as soon as you scroll upwards even a little bit, it pops up again. This is immensely frustrating because I tend to read at the top of a page and scroll down as I'm reading. So if I scroll down slightly too far and then correct myself, the banner will instantly obscure the bit of the text I'm trying to read. It's very satisfying to be able to click on the bookmark and fix the site's crap design!

评论 #32999612 未加载

评论 #32998963 未加载

评论 #33002486 未加载

评论 #33003360 未加载

评论 #33002637 未加载

评论 #33003045 未加载

_V_超过 2 年前

Honestly I have uBlock set in a way that blocks most of this stuff by default. I have several "steps" of permissivity:1) (default) block all JS completely2) Block 3rd party js3) Permit all js (rare)If the web fails to render in (1) and I do not necessarily need anything on that web I can get elsewhere, I just leave the web. F that web and F that creator. If I have to (webshop etc) I usualy just enable (2) which works most of the time. (3) is basically only for special webs like banking etc which is just PITA to debug as you have to be logging in constantly etc.Websites today are just full of unnecessary crap and are downright unusable when on slower connection like 3G. Most of the webs now require your browser to download 2M of JS to have "slide out menus" or some other stupid stuff. uBlock is a must, because without that you will run out of data plan almost instantly.And to make things worse, Chromium-based browsers will make adblocking much harder with Manifest v3. As soon as this happens, I will go to Firefox. And after that probably Links (unironically).Btw spinning up a docker to shrink 1 JS function to a oneliner is perfectly capturing the essence of what's wrong with web nowdays :-D

评论 #33005798 未加载

评论 #33003565 未加载

评论 #33005988 未加载

acabal超过 2 年前

I use this all the time, it's invaluable. I also use it to remove sticky headers, which I find to be deeply annoying because they waste space and often break keyboard scrolling by scrolling the next few lines of text under the header.In Firefox I've assigned it a keyword shortcut, so I can type `ctrl + l` to select the address bar, then `ks` `<enter>` to execute the JS without having to click.

评论 #33001822 未加载

评论 #32998641 未加载

ryandrake超过 2 年前

I feel I'm getting close to the point where I'm just going to start disabling CSS and JS for normal web browsing, only whitelisting certain sites that 1. I have to use and 2. Simply don't work at all without CSS/JS. IMO browsers have abandoned their role as the "user's agent" and handed over entirely too much control over style, presentation and function to web developers. The fact that you need plugins, extensions, adblocks, bookmarklets, and so on, just to regain this control should be troubling but I guess progress has to march on.I know I'm in the tiny minority here and firmly in the "yelling at the clouds" territory, but I really wish we could go back to the simpler times of the web being hyperTEXT documents linked together and that's it.

评论 #32999462 未加载

评论 #32999413 未加载

评论 #32999723 未加载

评论 #33000525 未加载

评论 #32999470 未加载

评论 #33000442 未加载

评论 #33002171 未加载

评论 #33000212 未加载

评论 #33002697 未加载

ryanianian超过 2 年前

Browsers were able to fight window.open popups back in the day by intercepting/blocking the window.open API. This was, iirc, one of the killer features of firefox back in the day. But cat and mouse: websites are now abusing CSS to recreate the popup experience.Bookmarklets like this are helpful (and this is a great successor), but bookmarklets are very difficult to install and use for the average internet user. I could not figure out how to install this on my iPhone without using desktop Safari to sync bookmarks.Is there any hope of browsers being able to combat popup modals and other sticky gross things in an automated (and on by default) way that doesn't totally break sites that require sticky items for navigation or other, non-hostile features?

评论 #32999633 未加载

评论 #32999652 未加载

评论 #33005832 未加载

评论 #33000493 未加载

bsimpson超过 2 年前

It's wild that you have to set up Docker to contribute to 600 characters of JavaScript.It's like building a robot to pass the butter.

评论 #33002270 未加载

评论 #33001768 未加载

评论 #33005340 未加载

ARandomerDude超过 2 年前

I kill sticky elements with the back button. If a site wants to hassle me, I won't give them attention or ad money.

评论 #32998854 未加载

评论 #33004558 未加载

userbinator超过 2 年前

I seriously don't understand why some people seem to like position:sticky so much. It's really offensive when the element I'm trying to scroll out of the way refuses to leave and clings to the edge, almost mockingly.I've had a "replace sticky with relative" filter in my MITM proxy since the day that CSS misfeature showed up in browsers.

评论 #33000742 未加载

评论 #33000459 未加载

bauble超过 2 年前

I used that for a while, but I was using it so often that I installed <a href="https://addons.mozilla.org/en-US/firefox/addon/alwayskillsticky/" rel="nofollow">https://addons.mozilla.org/en-US/firefox/addon/alwayskillsti...</a>. Sometimes I see things flicker briefly into view and I'm reminded that it's working. I've had to whitelist several sites that I use regularly, but it's pretty low maintenance after that.

szhu超过 2 年前

Similar thing I made recently, but as a Chrome extension:<a href="https://github.com/szhu/pagefreeze" rel="nofollow">https://github.com/szhu/pagefreeze</a>It does the same thing, and in addition also prevents any async JS from running. It also can be easily toggled per-site; just click the extension icon! Unfortunately I didn't have time to put a GIF in the README. OP did a better job of explaining what their project does!Would love feedback on it + hope it helps someone as well!

评论 #32999657 未加载

sillysaurusx超过 2 年前

Is there a way to do this on mobile? Probably not an easy one, but if mobile Safari had an extension, I'd install it immediately.The worst is when you use the top edge of the screen to read, but the site has a navbar that only shows up when you scroll up. So if you scroll slowly upwards, the navbar creeps slowly downwards, and keeps hiding the text you're trying to read. Thankfully such design choices seem to be getting rarer.Do sticky headers measurably increase conversion rates, or is it a fad? If there's data to support why people keep making this decision, I guess I could be persuaded to feel that it's not a case of "Everyone likes to do it their way, and you like your way."

评论 #32998860 未加载

评论 #32999070 未加载

评论 #32998936 未加载

评论 #32999240 未加载

aendruk超过 2 年前

Reminder that you can also configure persistent rules to do this with your favorite wide-spectrum blocker:<pre><code> example.com###annoying-header:style(position: unset !important) example.com##.restrictive-box:style(overflow: unset !important)</code></pre>

评论 #32999277 未加载

1970-01-01超过 2 年前

Just wanted to thank you for making this. It's working perfectly with Twitter.

karaterobot超过 2 年前

I spent an afternoon trying to figure out how to detect when an element had its display or transform properties changed when it was also the full size of the screen. This was my proposed heuristic for deciding when something was a full screen popup, in the process of taking over your window. The idea would be to zap these elements when they were triggered, so that you'd not have to encounter them in the first place.Cool story huh? Anyway, that never went anywhere, but I'd donate to an open source project if a better programmer than me wanted to take on this noble struggle.

cercatrova超过 2 年前

I use this often. However I sometimes want the sticky part to stay where it initially rendered on the page, like a nav bar. Perhaps I don't know enough CSS but anyone know how I can do that?

评论 #33000138 未加载

评论 #32998895 未加载

评论 #32998438 未加载

Night_Thastus超过 2 年前

Fantastic. Making the web a less awful place, one workaround at a time. You've got my bookmark.Now, make an auto-detect for this and stick it into something like uBlockOrigin and we're golden. :)

autoexec超过 2 年前

I use an addon called "nuke anything" that lets you right click and remove pretty much anything (only until the page is reloaded). It's a lifesaver when you browse with JS disabled since that can cause pages to display poorly (menus spewed all over the screen for example) but it comes in handy a lot for sticky elements. I have seen a few sites that manage to prevent certain things from being selected though. It's nice to have yet another tool to fall back on if I need it.

评论 #32999949 未加载

tempodox超过 2 年前

I find this very useful.On Unix, when you have Node.js installed, you can avoid the Docker overhead for creation of a bookmarklet from a JS file with a shell script like this:<pre><code> cat 'kill-sticky.js' \ | tr -s '\011\012\015\040' '\040' \ | node -e 'console.log(`javascript:${encodeURIComponent(fs.readFileSync(process.stdin.fd).toString())}`)' </code></pre> Insert the output as your bookmarklet's URL.

sorenjan超过 2 年前

I sometimes end up on pages that I can't scroll. It turns out some pages show a sticky div with a cookie consent dialog, and uBlock has removed it but left the overflow: hidden on the body tag that the site owner found necessary to put there until I click on the now removed div for some reason.

marcodiego超过 2 年前

I have this addon: <a href="https://addons.mozilla.org/en-US/firefox/addon/kill-sticky/" rel="nofollow">https://addons.mozilla.org/en-US/firefox/addon/kill-sticky/</a> installed on Firefox. Use it more than I'd like.

fisherjeff超过 2 年前

Ha, wow, I wrote my own (much less fancy) bookmarklet that does this and also called it Kill Sticky:javascript:for(e%20of%20document.querySelectorAll(%22body%20*%22))%7Bp=getComputedStyle(e).position;if((p===%22fixed%22)%7C%7C(~p.indexOf(%22sticky%22)))e.parentNode.removeChild(e);%7D

评论 #32999340 未加载

axiolite超过 2 年前

Unfortunately, bookmarklets don't work on Firefox mobile. Fortunately however, the "Hide Fixed Elements" and "Scroll Everywhere" add-ons do work on mobile:<a href="https://addons.mozilla.org/en-US/firefox/addon/hide-fixed-elements/" rel="nofollow">https://addons.mozilla.org/en-US/firefox/addon/hide-fixed-el...</a><a href="https://addons.mozilla.org/en-US/firefox/addon/scroll-everywhere/" rel="nofollow">https://addons.mozilla.org/en-US/firefox/addon/scroll-everyw...</a>That is, if you jump through the hoops to make more than the default 8 add-ons available on Firefox mobile:<a href="https://blog.mozilla.org/addons/2020/09/29/expanded-extension-support-in-firefox-for-android-nightly/" rel="nofollow">https://blog.mozilla.org/addons/2020/09/29/expanded-extensio...</a>

评论 #33003076 未加载

评论 #33000582 未加载

评论 #33003938 未加载

Yizahi超过 2 年前

Tried this script on a handful of different websites - news, tech, forums, reddit. In 100% of cases this scripts nukes top header completely, leaving me without navbar or menu. So it is a very enticing tool, but unfortunately not usable.

curlftpfs超过 2 年前

> Set the style of the html node for overflow: autoI have a custom style to do this for ALL sites, warning:1. it can break websites in unexpected ways2. There's often a class on the <body> hiding overflow that needs to be overwritten instead/as well

vmoore超过 2 年前

You could pass this code into Tampermonkey/Violentmonkey[0] and use it globally on every domain.[0] <a href="https://violentmonkey.github.io/" rel="nofollow">https://violentmonkey.github.io/</a>

vlunkr超过 2 年前

Sticky positioning on mobile devices is rarely a good experience. (Though it might be my tiny phone screen.) I would love for it to get special treatment on mobile so it could always be dismissed or something.

alphabet9000超过 2 年前

i wish there was a way, with CSS only, to specifically target existing css rules, and have one rule change to another rule, globally. for instance, something like: [position:fixed] { position:relative }. i.e. that is different than * { position:relative }, because it doesn't apply position:relative to everything, it only changes position:fixed to position:relative.

sf_rob超过 2 年前

Is there a purpose built bookmarklet searchable repository anywhere like there are for extensions/addons?

sp332超过 2 年前

Is there something that will prevent Medium pages from scrolling to the top when you reload the page?

评论 #33002845 未加载

jerrygoyal超过 2 年前

People who are using some other bookmarklets, could you share so others can benefit as well?

评论 #33020601 未加载