当鼠标悬停在尖端上时,如何防止jquery.qtip2工具提示隐藏?

时间:2011-08-30 20:10:40

标签: qtip2

使用jquery qTip2提供工具提示。

我有一个带有链接的工具提示。如果用户的鼠标进入尖端(不是触发器),我希望尖端保持打开状态。似乎无法弄清楚如何在documentation ....

中做到这一点

2 个答案:

答案 0 :(得分:49)

如果您希望它在鼠标悬停并进入提示时保持可见,但仍希望它在鼠标移除时关闭,请使用固定和延迟选项described in the documentation here

$('.selector').qtip({
     content: {
          text: 'I hide on mouseout, but you can mouse into me within 500ms',
     },
     hide: {
          fixed: true,
          delay: 500
     }
});

hide参数有很多选项。例如,如果您只是想无限期地隐藏它,只需将hide设置为false:

$('.selector').qtip({
    content: {
        text: 'I never hide',
    },
    hide: false
});

如果您希望它隐藏在其他事件上,例如点击提示之外的任何位置,请明确设置事件:

$('.selector').qtip({
     content: {
          text: 'I hide when you click anywhere else on the document',
     },
     hide: {
          event: 'unfocus'
     }
});

如果要在单击触发器时隐藏它,请指定单击事件:

$('.selector').qtip({
     content: {
          text: 'I hide when you click the tooltip trigger',
     },
     hide: {
          event: 'click'
     }
});

有关详细信息,请参阅the "hide" options documentation

答案 1 :(得分:5)

如果您希望提示保持打开状态,然后在用户点击目标外部或离开目标时将其隐藏:

show: {
    event: 'mouseover'
},

hide: {
     event: 'click mouseleave'
}