Tampermonkey script to allow scrolling youtube search bar off top of page stopped working correctly
I use the following on youtube pages to allow the top search-bar section to be scrolled off the top of the page (otherwise it is fixed in place).
GM_addStyle("#masthead-container.ytd-app { position: static !important; } #page-manager.ytd-app { margin-top: 0 !important; }");
Recently, youtube added some kind of effect that is applied around the video window (a kind of blurring of the colors in the video that extends beyond the video border). I think it's only part of the "dark theme". This effect seems to be covering up the search bar with my modified style applied. The search bar appears and then fades out. How can I turn this effect off? Or at least make it so it doesn't cover up the search bar? I'd prefer to turn it off completely.
Chosen solution
Try using position: absolute because with position: static, you lose the z-index.
Read this answer in context 👍 1All Replies (6)
Does your Firefox exhibit a disappearing scroll bar on any other sites or is it exclusive to YouTube? I ask that because on Mac and Windows, Firefox will fade out the scroll bar at times based on an OS-level setting and maybe that has come to Linux as well (possibly related to the overlay scroll bar feature).
The scroll bar is not disappearing. It's the "search bar" (as I am calling it) at the top of youtube, which is part of the youtube page. It looks like the attached picture. The GM_addStyle above allows it to be scrolled off the top of the page where it would normally be fixed (i.e., the rest of the page would scroll but the "search bar" portion wouldn't). It used to work fine but in the last few days it's been fading out and is replaced with the weird blurring effect that youtube is adding around the video in dark-theme mode.
You can open the Inspector and search for .ytd-app to see what comes up.
cor-el said
You can open the Inspector and search for .ytd-app to see what comes up.
I tried doing that but couldn't find what to change. I'll try again. I was hoping someone with more experience could figure it out. I'm viewing the page with the dark theme in "theater" mode (toggled with the 't' key). The script looks like this: // ==UserScript== // @name YouTube // @namespace http://tampermonkey.net/ // @version 0.1 // @description Allow search bar to be scrolled off the top. // @author You // @match https://www.youtube.com/* // @grant GM_addStyle // ==/UserScript==
(function() {
'use strict';
GM_addStyle("#masthead-container.ytd-app { position: static !important; } #page-manager.ytd-app { margin-top: 0 !important; }");
})();
Modified by L KL
Chosen Solution
Try using position: absolute because with position: static, you lose the z-index.
jscher2000 - Support Volunteer said
Try using position: absolute because with position: static, you lose the z-index.
That worked! Thank you. I would've liked to have gotten rid of that strange effect youtube adds around the picture, too. But the main thing was the disappearing search bar, so that solves it. I also had to remove the margin-top:0 part as that wasn't needed anymore.
Modified by L KL