[DOM Tooltip] Example 9: Auto-Generated Tips

In order to reduce the footprint of the DOM Tooltip library, the tips can be automatically created by reading the 'title' attribute on the page elements. To enable this feature, call the function 'domTT_replaceTitles()' at the bottom of the page.* This function looks for elements that contain the class 'tooltip' and have a 'title' attribute set. The title attribute is replaced with a custom tooltip. The 'domTT_replaceTitles()' function also takes an optional decorator function, which can be used to customize the rendering of the title content within the tooltip.

Another way to abstract the usage of the DOM Tooltip library is to use the integration with the behaviour library, which is used in the third example below. This library uses CSS selectors to define javascript behaviour on an html element. This method of defining tooltips is strongly encouraged, since it enables seperation of html and javascript. It also prevents lock-in to the DOM Tooltip library.

- Need help? - | - Recommended reading - | - Clean up your markup -

* Using this feature takes away some of the functionality of the tooltip library. This problem might be addressed in future releases.