Javascript qTip2隐藏-结合非聚焦、非活动和固定
我使用qTip2作为工具提示。我希望有此工具提示隐藏行为:Javascript qTip2隐藏-结合非聚焦、非活动和固定,javascript,jquery,qtip2,Javascript,Jquery,Qtip2,我使用qTip2作为工具提示。我希望有此工具提示隐藏行为: -当我单击标题上的“关闭”按钮时,toopltip将隐藏(按钮:true) -当我单击页面上的其他位置时,工具提示将隐藏(事件:'unfocus') -当我在3秒钟内不与工具提示交互时,工具提示将隐藏(inactive:3000),但仅当我的鼠标光标不在工具提示上时(fixed:true) 按下关闭按钮时隐藏可以: content: { title: { button: true } } 取消焦点时隐藏
-当我单击标题上的“关闭”按钮时,toopltip将隐藏(
按钮:true
)-当我单击页面上的其他位置时,工具提示将隐藏(
事件:'unfocus'
)-当我在3秒钟内不与工具提示交互时,工具提示将隐藏(
inactive:3000
),但仅当我的鼠标光标不在工具提示上时(fixed:true
)
按下关闭按钮时隐藏可以:
content: {
title: {
button: true
}
}
取消焦点时隐藏也可以:
hide: {
event: 'unfocus'
}
当我不与它交互时隐藏仍然没有问题:
hide: {
event: 'unfocus',
inactive: 3000
}
现在,我可以通过单击页面上的其他位置、关闭按钮或在工具提示上不移动鼠标3秒钟来关闭工具提示。但是当我的鼠标在工具提示上并且在3秒钟内不移动时,工具提示也会关闭-这是不可取的
为了在鼠标移动到工具提示上时保持可见,我可以使用以下方法:
hide: {
fixed: true,
delay: 3000
}
现在,当鼠标在3秒钟内不在工具提示上时,它将关闭。但当我点击页面上的其他地方时就不会了。因此,让我们结合unfocus
和fixed
:
hide: {
event: 'unfocus',
fixed: true,
delay: 3000
}
现在,当我单击页面上的其他位置时,它将关闭,但在离开工具提示3秒后不会关闭。因此,让我们尝试添加非活动的:
hide: {
event: 'unfocus',
inactive: 3000,
fixed: true,
delay: 3000
}
现在,当我单击页面上的其他位置时,它将关闭,也将在离开工具提示3秒后关闭,但在工具提示上不活动3秒后关闭
当我单击页面上的其他位置时,以及离开工具提示3秒钟后,如何关闭工具提示,而不是当我仍在工具提示上时?我有一个类似的要求,如前所述,我看到的唯一解决方案是自己实现“非焦点”部分。因此,您最终的配置是:
$el.qtip({
content: {
title: {
button: true
}
},
hide: {
fixed: true,
delay: 3000
}
})
然后实施非焦点行为:
var api = $el.qtip('api');
$el.closest('html').on('mousedown touchstart', function(e) {
api.hide(e)
});
简而言之:我是qTip的新手,但你的所有尝试让我觉得这可能是不可能的。如果不是,您可能只需要将其配置为“单击其他位置”部分以外的所有内容,然后添加您自己的$(文档)。单击(…)处理程序,如果单击了提示以外的任何元素,则该处理程序将隐藏提示。对不起,我帮不上什么忙了。我一直在寻找同一个问题的答案。是的,看起来确实没有非黑客的方法来解决这个问题。这段代码有一个小问题——如果您有更多带有工具提示的元素,在单击其他位置时,只会隐藏DOM中的第一个工具提示。要隐藏所有工具提示,只需调用$el.qtip('hide')在mousedown函数中使用code>,而不是使用api
。