Question

Tipsy Is lightweight and great technology for facebook tooltip style. now i need to this for multiple link. eg :

<table id=\"gravity\">
   <tr height=\"22\">
       <td width=\"1%\" align=\"center\" bgcolor=\"$bgcolor\">
            <a id=\"foo\" title=\"test\" href=\"#\" > $id</a> //$id dynamic id for link 1, 2, 3, ...
       </td>
   </tr>
</table>

Js included is :

$(function() {
$('#foo').tipsy({gravity: 's'}); });

This Worked For me But print and show only first id (first link) and next link now show tipsy. what’s Problem ? how to work for multiple link ?

Answer 1

If you want the plugin to apply on all the links then change the selector to match all those links. Best is give a class tipsy or watever you name to all the links and find them using class selector. Try this.

Markup (Note: I have added class=”tipsy” to the link)

<table id=\"gravity\">
   <tr height=\"22\">
       <td width=\"1%\" align=\"center\" bgcolor=\"$bgcolor\">
            <a id=\"foo\" class=\"tipsy\" title=\"test\" href=\"#\" > $id</a> //$id dynamic id for link 1, 2, 3, ...
       </td>
   </tr>
</table>

JS

$(function() {
    $('a.tipsy').tipsy({gravity: 's'}); 
});