引导工具提示在初始悬停时处于错误位置，然后处于正确位置
我使用的工具提示从twitter引导在一个网页上的div。工具提示已初始化，但在第一次悬停时，它处于错误的位置；但是，在随后的悬停中，工具提示处于正确的位置。
我认为出现问题是因为附加工具提示的div是绝对定位的。
下面是我的HTML中的div标记：
<div class="btn-group" id="sample-menu" data-toggle="tooltip" data-placement="left" title="Tooltip on left">
（尺寸没有改变，只是截图裁剪尺寸）
应用于div的样式有：
#sample-menu {
position: absolute;
top: 95px;
right: 608px;
}
我可能会对div进行不同的定位以使其工作，我只是想知道为什么工具提示似乎在绝对定位的div上工作完美，但只是在第一次悬停之后。
**我在divs上添加了一些没有绝对定位的工具提示，我也遇到了同样的问题（工具提示的第一次出现从我的元素中删除，然后在第一次出现之后它是正确的）。我在页面上有一个svg，其中有正在添加的元素，并用javascript(d3)调整其大小。看起来我需要调用一些东西来重新定位所有页面元素之后的工具提示，然而，没有一个引导工具提示或系绳重新定位的解决方案对我起作用。
共有2个答案
您还可以在工具提示配置中指定其他容器（不仅仅是'body')。
我使用HTML进行了如下项目：
<body>
<div class='wrapper'>
...
<div>
<p>Test message with tooltip <span class="tooltip-icon"
data-toggle="tooltip"
data-placement="right"
title="Tooltip test">?</span></p>
</div>
...
</div>
</body>
并且在工具提示定位计算方面存在问题,使用以下js：
$('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
据我所知，问题是由body元素的margy:0样式引起的。
为了在不更改body元素和默认标记样式的情况下解决此问题，我使用了其他容器，如下所示：
$('[data-toggle="tooltip"]').tooltip({
container: '.wrapper'
});
所有的工作都很完美，没有任何改变。
从引导文档中：
https://getbootstrap.com/docs/4.3/components/tooltips/#options
name: container
values: string | element | false
default: false
descr.: Appends the tooltip to a specific element. Example: container: 'body'. This option is particularly useful in that it allows you to position the tooltip in the flow of the document near the triggering element - which will prevent the tooltip from floating away from the triggering element during a window resize.
如果检查Bootstrap的tooltip.js，您将看到，如果将container值设置为字符串，它将尝试在DOM中找到具有给定选择器的元素（请参见_proto._getcontainer()方法)
以下内容在过去为我提供了涉及绝对定位的工具提示：
$('[data-toggle="tooltip"]').tooltip({
container: 'body'
});
我只是触发这个脚本后，所有的事情都完成了，呈现在页面上，一切都设置好了。同样，在有工具提示更新的地方，我必须再次运行这个。
-
我一直在尝试实现d3中的树映射图。在我的空闲时间项目中使用js库，我很难正确定位工具提示。我想它应该是这里提到的，但有几个div，我想它是放错地方了。这是我正在使用的树形图，我尝试了这里的一些建议，但似乎没有一个能使它适合我的使用。 这是我的JSFIDLE：
-
我想改变两个div的位置时悬停在一个div。在下面的代码中，当我悬停在.img div上时，我想移动顶部的.title div（位置例如top:50px)，并在其下方显示最初设置为隐藏的.info div。 我正在尝试跟随代码，但似乎不工作的悬停。我将感谢任何帮助。 HTML： CSS： 演示。http://jsfidle.net/upwv3/
-
我需要一些帮助我想改变工具提示基于按钮主色。 例如：如果按钮具有“主色”，则工具提示也应为“主色”。。。 超文本标记语言： jQuery： 实例：https://codepen.io/themes4all/pen/NWabvad
-
问题内容： 我正在寻找一种解决常见问题的方法，即在页面的页脚处停止固定对象。 我基本上在屏幕的左下角有一个固定的“共享”框，我不希望它在页脚上滚动，因此我需要它在页脚上方停止。 我在这里以及其他地方都看过其他问题。但是我无法使其适合我的情况。 这是共享框的html： …和CSS： 页脚是并且它没有固定的高度（如果有任何区别）。 如果有人可以帮助我为此创建一个简单的jQuery解决方案，我将不胜感激
-
当我悬停在第一个Div上时，工具提示显示得比我悬停在下面两个Div上时更远。显然，这是因为div中的文本更大/更长。但是我不想显示不依赖于悬停文本的工具提示跨度，而是与文本的包含div相关，所以它总是显示在相同的位置。 jQuery不是任何选项，但我认为，这是一个CSS问题。 null null
-
价格应该以两个小数格式附加在‘总利润:$'后面。当我悬停在折线图上时，我想显示如下内容： 下面是我填充相关数组的代码： 我试图按照@grunt的建议合并x轴标签的回调：