Question

I am using qTip: http://craigsworks.com/projects/qtip2 and my current problem is that when I hover the tooltip it disappears (because the target was mouseleave/mouseout).

Is there a way to make it stay visible when I hover the tooltip? I positioned the tooltip so that its right under the target so there are zero empty space between the target and the tooltip.

Answer 1

Use fixed: http://craigsworks.com/projects/qtip2/docs/hide/#fixed

You may wish to add a delay as well before the tooltip disappears, in case there’s some distance between your triggering element and the tooltip.

e.g.

$('.moreinfo').qtip({
    content: {
        text: $('<p>This is a tooltip.</p>')
    },
    show: {
        effect: function() { $(this).fadeIn(250); }
    },
    hide: {
        delay: 200,
        fixed: true, // <--- add this
        effect: function() { $(this).fadeOut(250); }
    },
    style: {
        classes: 'ui-tooltip-blue ui-tooltip-shadow ui-tooltip-rounded'
    }
});

Hope it helps.