Here is another solution, similar to the ones already proposed. Key differences:
- It uses jQuery .delegate() instead of .live() (faster, more efficient).
- It checks to see whether tooltips have been applied to the element using .data("tooltip") rather than the hasClass/addClass method. The tooltip plugin already attaches itself to the element using .data() with a key of "tooltip" - this is sufficient for checking whether or not the tooltip has been applied without having to add a class to the element.
- Rather than calling .show() to solve the "initial mouseover" problem, the mouseover event is re-triggered using .trigger(). A disadvantage of using .show() is that it displays the newly attached tooltip immediately, causing a different behavior if you have configured the tooltip plugin with a predelay. Re-triggering the mouseover event pushes you back through the full behavior of the tooltip plugin.
$(document).delegate("[title]", "mouseover", function() {
if (!$(this).data("tooltip")) {
$(this).tooltip({effect: "fade", predelay: 1000}).dynamic();
$(this).trigger("mouseover");
}
});