0

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

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

    <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>
4

1 回答 1

0

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

http://jsfiddle.net/dj2tvjjs/

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

$('#tt1, #tt2').tooltipster({
    position: 'bottom'
});
于 2015-08-10T10:06:25.920 回答