jquery - Twitter Bootstrap 工具提示 : flickers when placed on top of button, 但放置在左/右/底部时工作正常

Question

我正在处理 Bootstrap 工具提示实例的一些奇怪行为。

我正在使用的页面有几个按钮，当鼠标悬停在这些按钮上时，会显示带有按钮功能描述的工具提示。工具提示全部显示在按钮顶部，除了一个按钮之外，一切都工作正常。这一按钮显示的工具提示持续闪烁，工具提示本身覆盖了按钮的一部分(而不是完全在按钮之上)，并阻止按钮被正确单击。如果工具提示的“数据放置”从“顶部”更改为“左”/“右”/“底部”，工具提示将正确显示。

此外，给我带来问题的按钮被包裹在一个带有“float: right;”的div中。在css中赋值。我提到这一点是因为我注意到如果删除 float ，工具提示就可以正常工作。不幸的是，如果我删除 float ，按钮本身就会失去正确的位置。

虽然我可以放弃工具提示的“顶部”定位，但我希望有一个简单的技巧可以解决这个问题。有人有什么建议吗？

谢谢。

更新:

This StackOverflow question提出了与我遇到的问题相同的问题。我发现答案很有用。

Answer 1

添加到工具提示 pointer-events: none; css 规则，例如

.tooltip {
  pointer-events: none;
}

这将防止工具提示成为鼠标事件的目标，并解决该问题。