Tooltipster jquery 插件：工具提示在绝对定位图像上的位置答案

【问题标题】：Tooltipster jquery plugin: position of tooltip on absolute positioned imageTooltipster jquery 插件：工具提示在绝对定位图像上的位置
【发布时间】：2015-08-10 09:58:15
【问题描述】：

我正在使用 jquery tooltipster 插件 (https://iamceege.github.io/tooltipster/)，但我遇到了定位问题。我将图像放在地图上并绝对定位它们。我希望工具提示出现在底部，但我无法让它工作：它们一直出现在图像的顶部，并且工具提示的高位离开屏幕（请参阅here - 将鼠标悬停在树）。

这是我的代码：谁能告诉我我做错了什么？或者为什么工具提示没有出现在底部？

    <script>
        $(document).ready(function() {

            $('#tt1').tooltipster({
                minWidth: 400,
                maxWidth: 400,
                content: $('<span><p><strong>Duffel-West</strong><br>&nbsp;<br><img src="006.jpg"><br>&nbsp;<br>Kwb herorienteren in Duffel. Hoe kunnen we via het transitieverhaal nieuwe leden vinden? Op de infoavond rond de stroomafschakelingsprocedure zijn er mensen gevonden om een repair cafe te organiseren. Dit repair cafe was een succes met meer dan 100 bezoekers. Het is nu de bedoeling om dit twee maal per jaar te organiseren. Alsook dit te combineren met andere transitieactiviteiten.  <br>&nbsp;<br><strong>Status</strong><br>Kwb Duffel-West  slaagt in zijn herorienteringsproces. </span>'),
                position: 'bottom'
            });
        });
    </script>
</head>

<body>
    <img src="i1.png" width="30" height="41" id="tt1" style="position: relative; left:250px; top: 270px; cursor:crosshair" class="tooltip 1" title="Duffel West">
</body>

【问题讨论】：

标签： jquery tooltipster

【解决方案1】：

它是因为你的元素位置而产生的。您的工具提示不适合底部，因为它的空间比顶部少。您可以在这个小提琴中查看它的工作情况：

http://jsfiddle.net/dj2tvjjs/

在顶部图像中，您必须查看底部位置的工具提示，但在底部图像中，您必须查看工具提示的顶部位置使用相同的代码进行初始化

$('#tt1, #tt2').tooltipster({
    position: 'bottom'
});

【讨论】：

感谢您的回答。问题是：我需要工具提示出现在底部，并且我无法更改图像元素的位置（在最终版本中，它出现在一个国家/地区的地图上）。
Tooltipster v3 不会让你在底部没有足够空间的情况下强制位置到“底部”，它确实会切换到相反的方向。但是，Tooltipster v4 确实允许您强制一个位置。 v4 目前正在开发中，但将在未来几周内到期。