Twitter bootstrap 如何为一个图像提供多个工具提示

我想有三个不同的工具提示出现时，我悬停在一个图像没有嵌套div的

此代码确实有效：

<div class="col-md-6 col-md-offset-2">
     <div id="tooltip1" data-toggle="tooltip" data-placement="top" title="keyword1" >
     <div id="tooltip2" data-toggle="tooltip" data-placement="left" title="keyword2">
     <div id="tooltip3" data-toggle="tooltip" data-placement="bottom" title="keyword3">
     <img src="/img/600x336.jpg" class="img-responsive" /></div></div></div>
</div>

我想做的是类似这样的事情，“数据内容”可能是“id:position:title”：

参考：

---

有人有什么想法吗？我使用的是Bootstrap 3.1.1，我的javascript非常有限。

早期的方法有什么问题？在webkit浏览器中，工具提示分组错误，而在firefox中，它们不注意左下角或左上角或任何对角线位置。

<div id="tooltips1" data-toggle="tooltip" data-content="tip1,top,keyword1:tip2,left,keyword2:etc;">
    <img src="img/600x336.jpg" />
</div>