Jquery 引导工具提示未显示在正确位置的问题

我有一张地图的图像，上面有几个标记——每个标记都有一个

类。标记

是绝对定位的，父div

#map

是相对定位的——到目前为止还不错

我正在使用，我希望当用户悬停在其中一个标记上时，会弹出一个带有位置名称的图标。工具提示按预期显示和工作，只是它不在标记附近-它位于

#map

div的顶部

关于如何将工具提示设置为显示在绝对定位的标记旁边/顶部，有什么想法吗

任何帮助都将不胜感激

---

Ian不确定这是否适用于您的代码（发布？）

将此添加到您的js：

$(function() {
  $('.marker').tooltip({placement: 'right'});
});

或者如果您使用的是

数据-属性

：

<div class="marker" data-toggle="tooltip" data-placement="right"></div>

引导工具提示应用于相对位置元素。确保您的元素是相对位置的，否则您需要为.tooltip编写css以显示在正确的位置。

轻松更改tooltip data placement=“left”、data placement=“right”、data placement=“top”、data placement=“bottom”

下面提到代码

---

左侧的工具提示
顶部的工具提示
底部的工具提示
右边的工具提示
$（'[data toggle=“tooltip”]'）。工具提示({
});

你能在JSFIDLE中发布你的代码吗？嗨，老实说，我试过这么做-但是我没能让它在JSFIDLE中工作-我会再试一次…是的，我正在使用数据属性。是的，它被设置为右边。工具提示始终显示在

.map

div的顶部，marker类的css是什么样子的，可能会发布您的css。您可以尝试删除标记的所有自定义样式，并从中构建标记。您也可以尝试js的方法。$（'[data toggle=“tooltip”]'）。工具提示（{container:'body'，placement:'right'}）

<div class="col-md-10 col-md-push-1">
    <div class="col-md-3">
    <button type="button" class="btn btn-block btn-danger col-md-10" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
    </div>
    <div class="col-md-3">
    <button type="button" class="btn btn-block btn-primary" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>
    </div>
    <div class="col-md-3">
    <button type="button" class="btn btn-block btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>
    </div>
    <div class="col-md-3">
    <button type="button" class="btn btn-block btn-danger" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>
    </div>
</div>                

<script>
$('[data-toggle="tooltip"]').tooltip({
});
</script>