我如何使用jQuery循环遍历引导工具提示? [英] How can i loop through bootstrap tooltips forever using jQuery?

问题描述

我的网站上有一些缩略图，它们使用Twitters Bootstrap工具提示显示每个缩略图的名称，我想做的是遍历每个缩略图，比如说显示工具提示会延迟2秒，然后隐藏弹出下一个.我尝试了几种方法，但没有任何效果.

I have some thumbnails on my site, that use Twitters Bootstrap tooltips to display the name of each thumbnail, what i'm trying to do is loop through each one, with a delay of say 2 seconds showing the tooltip, then hiding it as the next one pops up. I tried to do this a few ways but nothing was working.

我得到了类似的结果，但是那没有用.

I got as far as something like this, but that wasn't working.

$("[rel=tooltip]").each(function (i) {
      $id=$(this).attr('id');
      $($id).tooltip('show');
  });

这是我的布局的JSFiddle: http://jsfiddle.net/BWR5D/

Here's a JSFiddle of my layout: http://jsfiddle.net/BWR5D/

有什么想法吗?

推荐答案

尝试以下操作:

var ttid = 0, tooltipIds = [];
$("a[rel=tooltip]").each(function(){
    tooltipIds.push(this.id);
});

var iid = setInterval(function(){
    if (ttid) $('#'+tooltipIds[ttid-1]).tooltip("hide");
    if (ttid === tooltipIds.length) ttid = 0;
    $('#'+tooltipIds[ttid++]).tooltip("show");
}, 2000);

• 您可以使用以下代码阻止工具提示显示: clearInterval(iid);

这篇关于我如何使用jQuery循环遍历引导工具提示?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！