dev/core#1790: Add short delay before closing tooltip elements

[reneolivo]

Overview

This PR prevents tooltips from closing as long as the user's mouse is inside of the tooltip element.

Before

After

Technical Details

The crmtooltip function was updated so it only hides the tooltip after leaving the tooltip element, or after a 300ms delay.

The tooltip was closing too soon because the mouseout event was being triggered for the triggering element only.

The new code works because mouseleave is triggered every time the mouse mouse leaves one of the tooltip's elements. Since the triggering element is a parent of the tooltip's contents it will also get this event because of bubbling. We use tooltipLink.filter(':hover') to determine if the mouseleave event was triggered, but the mouse is still not inside any of the tooltip's children. In this case the tooltip is closed as usual.

[civibot]

(Standard links)

• If this is your first pull-request for CiviCRM, please browse CONTRIBUTING.md for information about the development and testing processes.
• If you are reviewing this pull-request, you may wish to consult the test sites and the Review Standards (long template, short template).

[reneolivo]

Hello @eileenmcnaughton, this is the one we talked about before :)

[eileenmcnaughton]

@reneolivo cool - I'll leave it to @colemanw to confirm

[colemanw]

This looks good. There is a chance of the same code running twice due to the delay, but there's no harm in that as it's only removing css classes.