jquery工具 - 多個工具提示，不同的圖像

Question

我做了一些工具提示使用JQuery工具，它工作正常，但我想在同一頁上的另一個工具提示與不同的圖像，我不知道如何。這裏是我的代碼：

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

$(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; 

}

我想我應該能夠使一個同爲「tooltip2」，並選擇在CSS中不同的圖像而這一點，但變化「工具提示」此不起作用。誰能幫忙？不幸的是，JQuery Tools的論壇似乎被打破了，所以我在那裏找不到任何幫助。

謝謝。

Answer 1

這裏是我是如何做到的，但大概可以提高：

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

<span id="tip" class="green"> 
<img src="images/info21.png" title="(popup text 2)" /> 
</span> 


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

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

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