Fixing boagworld’s wobbly menu
Presenting a greasemonkey script to fix the sidebar menu on boagworld.com.
Paul Boag has a lovely site, broadcasts entertaining podcasts, and is generally an all-round good-guy within the field of web design. Every now and again, however, I find myself disagreeing with him; it would be a very weird world were that not the case.
For about as long as I can remember, the ‘Shows’ menu on the right hand side of the boagworld website has bugged me. It’s one of those ‘hover to hide/show’ effects that can be flashy and impressive when they work well, but really annoying when they don’t. Paul’s is quite a unique case in that it falls into both camps.
The boagworld.com menu: now it wobbles …
A lot of the time, the menu works fine. However, there’s a strange case, when heights between two show descriptions differ in just the wrong way, in which the whole thing becomes a nuisance. I’ve always wanted someone to do something about it, and finally became that person today.
Here is the simplest of greasemonkey scripts. By forcing all the ‘show’ elements to display, the ‘wobbly menu’ is replaced with a nice static list, with all the information clear and present at once:
// ==UserScript==
// @name fix boagworld menu
// @namespace http://www.fiveminuteargument.com
// @description fix boagworld's horrible menu
// @include http://boagworld.com/*
// ==/UserScript==
var dds = document.getElementById('shows').getElementsByTagName('dd');
for (i in dds) dds[i].style.display = 'block';
… now it doesn’t.
This is the first greasemonkey script I’ve ever attempted, and it was quite a nice experience all round. I hope others find it useful. And, Paul, I’m sorry. But you know it’s nothing personal ;-)
