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>

但我的触发元素不是<a href="http://www.stackoverflow.com" id="link1">。这是一个<li>，我的猜测是我不能在父<li>中添加<ul>以外的任何内容。换句话说，我不能像我应该那样放置触发元素之后。

我想出了一种方法来解决这个问题（用浮动的<li> s废弃无序列表并切换到浮动的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的ready（）：

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

在docu; - ）

中阅读更多内容

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

1 个答案: