Javascript 在页面滚动期间，引导弹出框闪烁

我正在使用Twitter引导来指示屏幕上当前显示的文章部分。始终显示popover消息，而不考虑正在进行的单击。我面临的问题是，在滚动过程中，popover会闪烁。我希望popover是稳定的，并显示信息没有闪烁。我该怎么做

引导弹出框：

---

下面是正在运行的演示：

它会闪烁，因为您在每次滚动动作时都会不断调用popover的show函数。您需要做的是使用一个标志或计数器，并且只告诉popover在其内容更新时显示

大概是这样的：

$(function () {
    $('#example').popover();
});
var counter = 0;
$(window).scroll(function() {
    var pos = $(window).scrollTop(); 
    var current = $('[name = "scroll"]');
    if(pos >= 0 && pos < 619) {
      if (current.attr("data-content") != "Introduction") {
        current.attr("data-content", "Introduction");
        current.popover("show");
        counter == 0;
      }
    } else {
      if (current.attr("data-content") != "Main Passage") {
        current.attr("data-content", "Main Passage");
        current.popover("show");
        counter == 0;
      }
    }

    if (counter === 0){
    current.popover("show");
    counter = counter+1;
    }

});

现在，如果可以，请尝试通过添加父容器使其更加明确，例如：

#container .popover {
 position:fixed;
}

---

否则，它将应用于页面/站点上的所有弹出窗口，具体取决于您如何实现css以及是否有其他弹出窗口。

这很好。但我对popover的z指数有问题。我使它比标题小。但是，当页面滚动时，消息仍然放在标题上方。我想把它们放在下面。你试过z-index:-1；在电视上，爆米花？此外，您可能需要在popover上使用“容器”选项。$'示例“.popover{container:”.title父元素“}；

$(function () {
    $('#example').popover();
});
var counter = 0;
$(window).scroll(function() {
    var pos = $(window).scrollTop(); 
    var current = $('[name = "scroll"]');
    if(pos >= 0 && pos < 619) {
      if (current.attr("data-content") != "Introduction") {
        current.attr("data-content", "Introduction");
        current.popover("show");
        counter == 0;
      }
    } else {
      if (current.attr("data-content") != "Main Passage") {
        current.attr("data-content", "Main Passage");
        current.popover("show");
        counter == 0;
      }
    }

    if (counter === 0){
    current.popover("show");
    counter = counter+1;
    }

});

.popover {
  position:fixed
}

#container .popover {
 position:fixed;
}