Nice titles

Another issuance from Stu’s House of JavaScript Weirdness: nice titles on links, a la Nate’s wish over at web-graphics.

Updates: The background of the nicetitle is now a transparent PNG (as explained by Lars Dieckow), so transparency relies on your browser’s support for such PNGs rather than proprietary opacity methods. The effect now works on keyboard navigation (tabbing to links) as suggested by Mark. There are now no longer rounded corners on the div, whether you’re in Mozilla or not, because Mozilla’s -moz-border-radius property doesn’t seem to work on the div any more (must be the background image). Cross-browser rounded corners seem to require inline images and nested divs, and I can’t think of a way of making the rounded corners transparent rather than white — if they just have a transparent background then they’ll show the main div’s background, which is our semi-transparent PNG, even though they should show the page below it. There is still no delay on the links, because delays are a pain; if you mouse off a link before the delay has occurred, then the remove function has to know to not try and remove, but more importantly, if you mouse from one link directly to another, sometimes the onmouseover for the second link fires before the onmouseout for the first link, which confuses nicetitle’s poor little brain. Further thought needed on how to handle that case. I also don’t understand why the div is sometimes cropped on the right under Mozilla/Linux. There’s no reason for it to be; I need to cut that down to a testcase and file it as a bug. Thanks for all the comments and enhancement requests, all.


I'm currently available for hire, to help you plan, architect, and build new systems, and for technical writing and articles. You can take a look at some projects I've worked on and some of my writing. If you'd like to talk about your upcoming project, do get in touch.

More in the discussion (powered by webmentions)

  • (no mentions, yet.)