jQuery 工具工具提示不能简单地通过具有位置的外部 div 工作：相对？答案

【问题标题】：jQuery Tools Tooltips does not work simply by an outer div having position: relative?jQuery 工具工具提示不能简单地通过具有位置的外部 div 工作：相对？
【发布时间】：2011-05-11 16:16:10
【问题描述】：

第三方 jQuery 工具提示是 jQuery Tools Tooltips: ToolTips Done Right。是否可以通过使用position: relative 的外部 div 来破坏？

这个有效： http://www.topics2look.com/code-examples/jquery-tools-tooltip-bug/this-works.html

只需将position: relative 添加到外部 div（带有蓝色边框的那个），工具提示就会大量错位（无论标题 div 向下推多少）：http://www.topics2look.com/code-examples/jquery-tools-tooltip-bug/with-relative-position-it-does-not-work.html

第 3 方开源代码的质量。

是否有任何 jQuery 大师快速修复？要求是出于某种原因，外部 div 必须具有 position: relative 或 position: absolute。我认为它破坏的原因是 jQuery Tools Tooltip 使用position: absolute 来定位工具提示，但不知道absolute 实际上是相对于“最近的祖先是定位”，如CSS规范说。所以它打破了，只是一个简单的案例。

【问题讨论】：

标签： javascript tooltip jquery-tools

【解决方案1】：

尝试使用relative property（倒数第三个）。

$('#main-content').tooltip({
    bounce: false,
    relative: true, // <-- Adding this should sort you out
    slideOffset: 5,
    effect: 'slide',
    direction: 'down',
    slideInSpeed: 300,
    slideOutSpeed: 200,
    position: 'bottom center'
});

【讨论】：

你确定了这个，虽然我想知道为什么与文档相关的那个不能很好地工作，还有为什么relative: true不是默认的，因为它更准确。跨度>
我仍然有这个问题，当我的容器也溢出时：滚动。向下滚动并打开工具提示时，工具提示会错位。有人可能知道解决方案吗？
我不确定。老实说，我认为 jQuery Tools 做工具提示的方式很奇怪。他们应该在关闭 </body> 标记之前重新注入额外的工具提示标记，以便 position:relative 不会影响它的定位。