我有一个链接,它使用Twitter Bootstrap Popover version 1.3.0显示一些信息。此信息包括一个链接,但每次我将鼠标从该链接移动到弹出窗口时,弹出窗口就消失了。
我怎样才能保持弹出窗口打开足够长的时间,使鼠标移动到它里面?然后,当鼠标移出链接并弹出时,隐藏它吗?
或者有没有其他插件可以做到这一点?
发布于 2017-02-15 15:59:51
现在我只需切换到webuiPopover,它就能正常工作。
发布于 2012-02-23 02:26:55
使用bootstrap (用版本2测试),我得到了以下代码:
$("a[rel=popover]")
.popover({
offset: 10,
trigger: 'manual',
animate: false,
html: true,
placement: 'left',
template: '<div class="popover" onmouseover="$(this).mouseleave(function() {$(this).hide(); });"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
}).click(function(e) {
e.preventDefault() ;
}).mouseenter(function(e) {
$(this).popover('show');
});
要点是用mouseleave() enabler覆盖模板。我希望这能帮到你。
发布于 2013-05-04 03:32:14
这有点老生常谈,但基于marchello的例子,我这样做了(不需要模板):
$(".trigger-link").popover({
trigger: "manual",
}).on("click", function(e) {
e.preventDefault();
}).on("mouseenter", function() {
var _this = this;
$(this).popover("show");
$(this).siblings(".popover").on("mouseleave", function() {
$(_this).popover('hide');
});
}).on("mouseleave", function() {
var _this = this;
setTimeout(function() {
if (!$(".popover:hover").length) {
$(_this).popover("hide")
}
}, 100);
});
setTimeout
有助于确保有时间从触发器链接移动到弹出窗口。
https://stackoverflow.com/questions/7703878
复制相似问题