Solution to multiple events triggered by children elements Created Nov 11, 2009

If you are getting multiple 'onShow' and 'onHide' events being triggered with your tooltip, this might help. Use mouseenter and mouseleave as your tooltop events:

...
events: { 
  def: "mouseenter,mouseleave", //  for an element 
  input: "focus,blur", // for all input elements 
  widget: "focus mouseover,blur mouseout", // select, checkbox, radio, button 
  tooltip: "mouseenter,mouseleave" // the tooltip element 
},
...

instead of the default "mouseover, mouseout" events. This prevent the events from being triggered by the mouse moving over element descendants.

My situation was a tooltip attached to a div with children span elements in it. There were multiple 'onShow' events because an event was triggered when the mouse moved over any of the children spans. This change prevents the events from being triggered by children. This gives me one event when the mouse enters the parent div and one 'onHide' when it leaves, the behavior I want.

Just in case anyone else wants the same. Might be nice for the event documentation too, it's a good reason for wanting to change them.

Thanks for the great library.
Josh