Example 6: Additional Features

In the sixth example, we really start to show off the additional features of this library. We show how DOM Tooltip can hunt down and hide form elements that cannot be overlapped.* We show how the tooltip can appear in a different quadrant relative to the tip (rather than always southeast). Finally we show how the tooltip can fade in!*** For the link on the right, the preserving of the onmouseout event is demonstrated, as we change the color from green back to the default blue.

You may also notice that on all of these tooltips, we are using the maxWidth feature, so that the tip doesn't get wider than a set number of pixels.**

Tooltip with hunt and destroy | Tooltip in new position | Tooltip fading in

* In IE, select elements are drawn using the native window library widgets and are thus sitting on top of the html page layer. Therefore, no html element can go above these decorations. Mozilla has a similar problem with the scrollbar on multiple selects or selects with a size that is more than 1. Opera 7 does not use window manager widgets and hence has no need to hunt and destroy form elements.

** In Mozilla and Opera 7, this can be done with styles. In the other browsers, there is a check in the DOM Tooltip library for domTT_maxWidth, hence the global variable setting.

*** Opera 7 and Konqueror do not support the opacity style at this time and hence neither cannot fade tips.

«Example 5
Example 7»