How to cause open event of jQuery UI tooltip to obey the show.delay property setting

Question

The open event of the jQuery UI tooltip fires not when the popup opens visibly but as soon as the mouse enters the element. It does not obey the show.delay property setting. This is documented behavior so I suppose it is not a bug.

So if I have tooltip on adjacent cells of a table, and the user drags the mouse across these cells, the actions in my open and close handlers are taken multiple times -- three, four, five times -- as many times as the number of cells the mouse entered.

What's a good way to exit the open event if the show.delay has not yet transpired?

EDIT: Not knowing how much time has elapsed on the delay.show, I've had to choose an arbitrary duration for the setTimeout, and track whether a class-switch is in progress using a flag:

     <snip> ...
     show: {
        delay: 666
     },

    open: function (event, ui) {
            if (me.changingClass) return;           
            me.changingClass = true;
            $("td.baz").switchClass("foo", "bar");

    },
    close: function (event, ui, dupids) {
        $("td.baz").switchClass("bar", "foo");           
        setTimeout(function () { me.changingClass = false; }, 200);
    }

Answer 1

I think this may do the trick, if I understand what you're after:

Working Example

var timer;
$('td').tooltip({
    show: {
        delay: 2000 //number of milliseconds to wait
    },
    open: function (event, ui) {
        var xthis = this;
        timer = setTimeout(function () {
            $(xthis).siblings().switchClass("bar", "foo");
        }, 2000); // number of milliseconds to wait
    },
    close: function (event, ui, dupids) {
        clearTimeout(timer);
        $(this).siblings().switchClass("foo", "bar");
    }
});