Make qTip not disappear when hovering the tooltip

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.

And take a look at the documentation, maybe the hide option will help. http://craigsworks.com/projects/qtip2/docs/hide/ — Tim, Jan 26 '12 at 14:11
Check the "hide.target" option [http://craigsworks.com/projects/qtip2/docs/hide/#target](http://craigsworks.com/projects/qtip2/docs/hide/#target). By default, the tooltip is hidden when leaving the element .qtip() was called upon. — Didier Ghys, Jan 26 '12 at 14:12

jdlm · Accepted Answer · 2012-01-26T14:30:26.227

18

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.

edited Jan 26 '12 at 14:30

answered Jan 26 '12 at 14:14

jdlm

6,327
5
29
49

That doesn't help. I have both delay and fixed: ture, but it still disappears when you mouseover on the tooltip by moving fast – mgPePe Nov 06 '12 at 19:00
The [documentation](http://craigsworks.com/projects/qtip2/docs/hide/#fixed) clearly states that this is the purpose of `fixed`. If it doesn't work it might be broken in the latest release, I haven't checked. – jdlm Nov 08 '12 at 08:01

score 2 · Answer 2 · answered Feb 28 '13 at 01:07

2

Use fixed: true as well as leave: false

The problem you might be having is that when you leave the qtip target it is hiding.

answered Feb 28 '13 at 01:07

Timothy Owen

466
1
6
17

Does "leave: false" go in the "hide" section as well? – AlbatrossCafe Jul 02 '15 at 20:36

score 0 · Answer 3 · answered Mar 06 '17 at 18:50

0

For some reason, using fixed:true alone didn't work for me. Instead, I had to use these configurations (v3.0.3):

hide: {
   fixed: true,
   delay:90,
},
position: {
   viewport: $(window)
},

answered Mar 06 '17 at 18:50

Matheus B.

29
4

Make qTip not disappear when hovering the tooltip

3 Answers3