jquery - 同一页面上具有不同图像的多个工具提示

Question

我已经使用 JQuery 工具制作了一些工具提示，效果很好，但我希望在同一页面上使用不同的图像提供第二个工具提示，但我不知道如何操作。这是我的代码：

<span id="tip">
    <img src="images/info20.png" title="(popup text)" />
</span>

$(function() {  
    $("#tip img[title]").tooltip({position: "top right", offset:[0,-25]});
});

.tooltip {
    display:none;
    font-family: arial;
    background: url(../images/purple.png);
    font-size:11px;
    height:70px;
    width:160px;
    padding:25px;
    color:#fff; 
}

我认为我应该能够制作一个与此相同的图像，但将“tooltip”更改为“tooltip2”并在 CSS 中选择不同的图像，但这不起作用。任何人都可以帮忙吗？不幸的是，JQuery Tools 上的论坛似乎坏了，所以我在那里得不到任何帮助。

谢谢。

Answer 1

您可以使用content以下选项设置工具提示的内容：

$(function() {  
  $("#tip img[title]").tooltip({
    content: 'Some Mighty Tooltip', 
    position: "top right", 
    offset:[0,-25]});
});

您可以在此处使用常量字符串，也可以使用函数。它实际上在那个小部件文档页面中描述得很好。