W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > July to September 2001

Tooltips on element focus

From: Charles F. Munat <chas@munat.com>
Date: Thu, 26 Jul 2001 10:45:10 -0700
Message-ID: <3B605726.1020605@munat.com>
To: W3C WAI Interest Group <w3c-wai-ig@w3.org>
Sorry to weigh in so late on this issue (and sorry if this has already 
been mentioned -- I missed a few posts in the thread).

Although none of the current crop of browsers pop up a "tooltip" on 
element focus, this can be simulated in some browsers by using the 
status line. Simply add the following to the link or form input:

onfocus="window.status=this.title"

and put your "tooltip" in the title attribute.

This works beautifully in IE 5.5. In Netscape 4 it doesn't work at all, 
of course (does anything work in Netscape 4?).

In Opera 5 it works for form inputs, but links seem to be a bit screwed 
up. I found that tabbing (well, "a"-ing) to the link did nothing, but 
mousing over it tripped the onfocus element *even when an onmouseover 
element was present*. Does Opera consider mouseover the equivalent of 
focus? Any Opera fans here want to explain this behavior?

In Mozilla 0.9, it works fine for form inputs, but the Mozilla folk seem 
to have decided that developers can't be trusted: the status line 
displays the href on focus and on mouseover no matter what you tell it 
(unless I missed something).

And, of course, it doesn't work in WebTV (at least not in the viewer). 
WebTV gives you the mouseover when you tab through the links, and 
doesn't recognize "this.title." One solution is to add:

onmouseover="window.status='Your title here.'"

in addition to the onfocus event handler. Unfortunately, this means you 
have to duplicate your title text, but there you have it.

The most cross-browser compatible solution seems to be:

<a href="#" title="Link title."
     onfocus="window.status=this.title;"
     onmouseover="window.status='Link title.';">Link.</a>

<form>
     <input type="text" title="Form input title."
         onfocus="window.status='Form input title.'" />
</form>

So it's not a panacea, but at least it's something. And really, the 
status line is a better option than the tooltip popup for focus events 
because it's visible as long as you have focus on the element and it 
doesn't cover other elements with a popup box the way a tooltip does. 
The drawback, of course, is that the user has to know to look at the 
status line. It's easy to miss it.

You can also add onblur="window.status=''" if you feel it necessary.

Charles F. Munat
Munat, Inc.
Seattle, Washington

Note: all comments above based on PC with Windoze. Can't speak for Macs 
or Linux/Unix at the moment...
Received on Thursday, 26 July 2001 13:43:16 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:13:55 GMT