jQuery UI - 工具提示位置错误答案

【问题标题】：jQuery UI - tooltip position is wrongjQuery UI - 工具提示位置错误
【发布时间】：2014-04-18 05:31:19
【问题描述】：

我正在使用 jQuery 工具提示为图像映射创建 html 工具提示。但是，当悬停发生时，工具提示会出现在整个图像下方。我希望工具提示出现在区域元素旁边。我将如何做到这一点？谢谢。

jQuery:

$("#trigger1").tooltip({ 
    items: "area",
    content: "<div class='tooltipContent'><h3>1896</h3><p>Bemidji became a town</p></div>"
});

html（示例）：

    <div ice:editable="*" class="top_banner" id="top_banner" style="position: relative;">
        <img alt="" style="border-width: 0px; border-style: solid;" usemap="#Map2" src="_images/timeline2.jpg" />
        <map id="Map2" name="Map2">
        <area id="trigger1" href="#" coords="21,99,12" shape="circle" />
        </map>
    </div>

直播页面：http://www.securitybankusa.com/about-test.htm

【问题讨论】：

tooltip() 有一个可以设置的位置选项，你必须使用该区域的位置。
@adeneo 这很有用，但它仍然基于图像而不是区域形状。
使用 position 可以指定一个 'of' 属性，这是一个定位基础的 ID，也可以使用 'using:function(position,feedback){$(this.css(position) ;} 给它正确的位置

标签： jquery html jquery-ui position jquery-tooltip

【解决方案1】：

您需要将工具提示配置为以任何您想要的方式定位。

关于位置选项的文档： http://api.jqueryui.com/tooltip/#option-position

【讨论】：