In support of the still-to-be-finished proposal for allowing most HTML 5 elements to become hyperlinks, I’ve written a quick proof-of-concept demo for your perusal. Basically, it’s a page with some JavaScript that captures the whole document tree, looks for any elements with an href attribute, and then sprinkles some events on those elements in order to make them act like hyperlinks. There’s also some CSS that applies old-school link presentation to said elements (blue and underlined, baby!). I’m using href because it was the easiest thing to do.
I’m sure I could have written a more elegant script (and yes, I know, your favorite JS framework would done it in half the lines and seventeen times the page weight) and I suspect there are some things I’m missing. I’ll be interested to hear what those may be. Meanwhile, if you want to try out your own arbitrary-element linking, grab a copy of the demo and edit the markup to your heart’s content. Or you could suck out the JS and apply it to your own test pages. Your call.
The demo works fine in Firefox 2, Camino 1.5, Safari 2, and Opera 9.2. I didn’t test it in anything else. It may well fail spectacularly in every other browser known to man and dog. That’s not really an issue, though. The goal here is to have a working demonstration, not a universal solution. (The latter may come later.) It’s a handy way to show people how browsers should behave in an arbitrary-link world.
The one thing that didn’t go right is the status-bar URL handling when hovering over a linked element (other than an a element) that descends from another linked element. For some reason the descendant’s URL never shows up in the status bar. I’m sure there’s an easy fix. I regard this as a minor issue. [Update 7/23: this has been fixed thanks to Allwyn Fernandez.]
The biggest thing that’s missing is simulating “visited” styles on non-a elements; in this case, turning them purple. That would require mining the history and dynamically adding classes and, well, all kinds of stuff. I’m sure it’s possible. I’m also sure that I don’t have the time right now to figure out how to do it well. Besides, ship early, ship often, right?
As I said before, I’m very interested to know what people think of the demonstrated behavior and how it might be improved. And hey, if anyone wants to contribute improvements to the JS, I’ll do my best to keep up.
One more step toward a concrete proposal…
