Search code examples
delayshow-hideqtip2

qTip 2: trigger hide before delayed show?


I'm having an annoying little interaction issue with qTip 2. A button on my page has a tip attached to it, set to appear on mouseover after a 500ms delay and disappear immediately on mouseout.

When the button is clicked, the whole view changes and that particular button disappears, so I force the tip to hide immediately (otherwise, it hangs around until the user moves their mouse, even though the button that triggered it is no longer visible).

The problem is that the immediate hide event doesn't seem to cancel the delayed show event if it happens to occur first. In other words, if the user points at the button and clicks it in less than 500ms, the hide event triggers (doing nothing) and then the show event triggers at 500ms, causing the tooltip to display even thought the button is no longer there (and in the wrong position to boot, since it can't position itself correctly without the button being visible).

Is there a way when I trigger the hide event to tell it to just stop there and not perform any other events?


Solution

  • I solved it like this (@Daniel, your answer was close so I'll upvote you too):

    events: {
        show: function(event, api) {
            if ($("#mybutton").is(':hidden')) {
                try { event.preventDefault(); } catch(e) {}
            }
        }
    };
    

    This is the method that qTip's documentation recommends.