Johan
Johan

Reputation: 35194

jQuery UI tooltip won't close when using dynamic content

Here is my code to simulate an ajax call to fetch the tooltip content:

$(document).tooltip({
    items: 'a',
    content: function(result) {
        setTimeout(function() {
            result('foo');
        }, 500);
    }
});

If you move the mouse on and away from the link several times, it will sooner or later get to a point where the tooltip doesn't close, even though the mouse isn't hovering the link.

Any ideas what might be causing it or how to solve it?

jQuery UI toolip

http://jsfiddle.net/tj_vantoll/Z2R43/

Upvotes: 2

Views: 625

Answers (1)

jammykam
jammykam

Reputation: 16990

I've had this issue before where moving the mouseover the link causes the event to fire each time and stacks them up in the background. I solved the issue with the hoverIntent plugin which would only fire the event if the user waited on the link for a specified amount of time.

You can do the same in Tooltip by adding in a delay on the show event which does the same thing:

$(document).tooltip({
    items: 'a',
    content: function(result) {
        setTimeout(function() {
            result('foo');
        }, 500);
    },
    show: {
        delay: 250
      }
});

Upvotes: 2

Related Questions