引导程序的弹出延迟不起作用

一段时间后我想要弹出窗口隐藏。 我编写了这个 – > CODE工作..

JS

$('#qoo').popover({ placement : 'left', html : true, delay: { show: 500, hide: 100 }, content: function() { return $('#content-wrapper1').html(); } 

}）;

HTML

 
  textttt 
 texttttttat
  

但它不起作用。

Answer 1

延迟显示/隐藏不会自动显示/隐藏弹出窗口，它会在此之前定义延迟！ 此外， 延迟不适用于手动触发类型 ，因此您必须具有触发器，例如hover 。 让延误工作。

 $('#qoo').popover({ placement : 'right', html : true, trigger : 'hover', //<--- you need a trigger other than manual delay: { show: "500", hide: "100" }, content: function() { return $('#content-wrapper1').html(); } }); 

但是，要实现自动隐藏弹出框，可以通过挂钩到shown.bs.popover事件来执行以下shown.bs.popover ：

 $('#qoo').on('shown.bs.popover', function() { setTimeout(function() { $('#qoo').popover('hide'); }, 1000); }); 

以上在1000毫秒，1秒后隐藏了弹出窗口。

Answer 2

我的解决方案：仅当用户将鼠标hover在链接上一段时间后，才会打开Popover。

 $('.popMonster').popover({ html: true, trigger: 'manual', delay: { show: 100, hide: 0 }, container: $(this).attr('id'), placement: 'auto', content: function () { $return = '
'; } }).on("mouseenter", function () { var delay_ = (function(){ var timer_ = 0; return function(callback, ms){ clearTimeout (timer_); timer_ = setTimeout(callback, ms); }; })(); var self = $(this), url = '/myurl/action'; delay(function(){ // Get content via ajax: $.get(url, function(data) { if(data == 'Unauthorized.'){ location.href = './'; }else{ self.attr('data-content', data); self.popover("show"); } }); }, 800 ); // time to wait before call ajax self.siblings(".popover").on("mouseleave", function () { self.popover('hide'); }); }) 

Answer 3

我已经尝试过你的代码了，你的代码中的问题是工具提示似乎没有被束缚在体内，它实际上是在体外，所以如果你将留下元素的余量，你将能够使它工作正确。 看看这个 ：

的jsfiddle

HTML：

 
  textttt 
 texttttttat
  

JS：

 $('#qoo').popover({ placement : 'right', html : true, delay: { show: 500, hide: 500 }, content: function() { return $('#content-wrapper1').html(); } });