Hiding the YouTube search bar
This morning, I got an email from Sam, asking if I had a way to cover up the persistent YouTube search bar:
If we do “Inspect Element” on a YouTube page, we can find the element that contains this search box:
var search_bar = document.getElementById("yt-masthead-container"); // Check if it's already hidden var hidden = (window.getComputedStyle(search_bar)).getPropertyValue("display"); // Set the visibility based on the opposite of the current state void(search_bar.style.display = (hidden == "none" ? "" : "none"));
To use this code, drag this link to your bookmarks bar:
Toggle the YouTube search bar
Something that wasn’t in my original Google Maps bookmarklet is that
void() call. It turns out that if a bookmarklet returns a value, it’s supposed to replace the current page with that value. Which strikes me as bizarre, but that’s what Chrome does, so it broke the page. (Safari doesn’t – not sure if that’s a bug or a feature.) The void function prevents that from happening.
This isn’t perfect – content below the bar doesn’t reflow to take up the available space – but the bar no longer hangs over content as you scroll. I think I’ll find this useful when I’m pressed for space on small screens. It’s a bit more screen real-estate I can reclaim. Thanks for the idea, Sam!