1

我准备了一个 jsfiddle 示例：

http://jsfiddle.net/PEH7t/11/

问题是我有一个位置相对的容器（无法更改）。我找到了 tooltip setting relative: true，这应该可以解决我的问题（它使用 jQuery 位置而不是 offset 来设置工具提示位置）。如果我没有 overflow: auto （这也不能更改），这将正常工作。当您滚动容器然后单击帮助图标时，工具提示会获取相对于容器的位置，但不会考虑滚动。它会导致错误的工具提示。

有谁知道如何解决这一问题？

额外的问题：当您第一次单击工具提示时，您会获得配置的动画。当您关闭工具提示并再次单击帮助图标时，工具提示会弹出而没有动画。如何改变这种行为，让它在显示时总是得到一个很好的动画？

4

2 回答 2

1

我对这个插件/工具包的了解不够多，无法评论如何修复 - 所以我建议您自己编写代码。

您可以编写一些代码来相当容易地做到这一点，只需在每个工具提示按钮旁边使用带有 display:none 的样式化 div。单击按钮时，切换工具提示 div。通过这种方式，您可以获得完全的控制权，而不必解决或硬塞现有代码。

例子：

css

.someContainer
{
    position:relative;
}
._js_tooltip
{
    display:none;
    width: 300px;
    height: 100px;
    position:absolute; /*relative to container*/
    top: 10px;
    right: 10px;
}

html

<!-- your tooltips are inline, positioned however you want -->
<div class='someContainer'>
  <div class='_js_tooltip'>this is a tooltip</div>
  <div class='_js_tooltip_button'>this is the button</div>
</div>

<div class='someContainer'>
  <div class='_js_tooltip'>this is a tooltip</div>
  <div class='_js_tooltip_button'>this is the button</div>
</div>

脚本

$('._js_tooltip_button').on('click', function(){
    $(this).siblings('._js_tooltip').toggle();
});
于 2012-03-08T11:50:31.207 回答
1

太奇妙了。我一直在思考一个解决方案几个小时，现在它突然袭击了我：

.editor-field
{
 position: relative;  
}

瞧。奖金问题仍然悬而未决。

于 2012-03-08T11:57:41.753 回答