jQuery flot the tooltip will not hide when I move the mouse quickly out of plot

Viewed 971

Please have a look at the example of jQuery flot with tooltip, which is at http://www.flotcharts.org/flot/examples/interacting/

When I put the mouse and move the normally the tooltip appears and disappears normally.

However when I move the mouse quickly out of plot, the tooltip will remain.

Please see below animated gif which shows slow and quick mouse movement.

enter image description here

The main part code which handles the hover is as below:

$("#placeholder").bind("plothover", function (event, pos, item) {

            if (item) {
                var x = item.datapoint[0].toFixed(2),
                    y = item.datapoint[1].toFixed(2);

                $("#tooltip").html(item.series.label + " of " + x + " = " + y)
                    .css({top: item.pageY+5, left: item.pageX+5})
                    .fadeIn(200);
            } else {
                $("#tooltip").hide();
            }
    });

I think it is because when I move the mouse quickly the $("#tooltip").hide(); executes when the $("#tooltip").html is not rendered.

2 Answers
Related