jQueryTools 要求 div 将工具提示放置在触发元素 (li) 之后 - 文档无法验证

Question

以下是有关如何使用工具提示的 jQueryTools 演示页面： http://flowplayer.org /tools/demos/tooltip/any-html.html

基本上，如果您想要一个包含 HTML 的工具提示，您必须将该 HTML 放在 div 中并将其直接放置在触发元素之后，如下所示：

<a href="http://www.stackoverflow.com" id="link1">
<div class="tooltip">
   <img src="img/SOicon.png">stack<span style="font-weight:bold">overflow</span>
</div>

但是我的触发元素不是 。它是一个

，我的猜测是我不能在父

< 中放置
• 以外的任何内容。 /代码>。换句话说，我无法像我应该的那样将触发元素放置在触发元素之后。

我想出了一种方法来解决这个问题（用浮动

废弃无序列表并切换到浮动 div），但我想我可能应该咨询专家（你们，当然！）在我开始解决问题之前。

你们会如何解决这个问题？

Answer 1

使用结构之外的另一个元素作为工具提示目标是没有问题的！

<ul id="mylist">
    <li title="List Point 1">List Point 1</li>
    <li title="List Point 2">List Point 2</li>
    <li title="List Point 3">List Point 3</li>
</ul>

<!-- many other HTML ELements -->
<div id="mylist_tooltip"></div>

最后放入 jQuery 的 read() ：

jQuery("#mylist li").tooltip({
    // target div
    tip: '#mylist_tooltip'
});

在 docu 中阅读更多内容；-)