Discussion :

[Invité]

Bonjour à tous.

Je vous explique mon problème :
j'utilise un plugin jQeury afin de créer des infobulles (tooltip) sur les cases de ma table HTML. Cela se présente comme suit :

Table HTML

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<table id="maTable">
  <tr id="trid_01">
     <td><a href='#tooltip' class='clic'>Case 1A</a></td>
     <td><a href='#tooltip' class='clic'>Case 2A</a></td>
  </tr>
  <tr id="trid_02">
     <td><a href='#tooltip' class='clic'>Case 1B</a></td>
     <td><a href='#tooltip' class='clic'>Case 2B</a></td>
  </tr> ETC...
</table>

ToolTip

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<div id="tooltip" class="tooltip_cls">
  <ul>
     <li class="top"></li>
     <li><a href="#" onClick="walk(0);" rel="close">Modifier</a></li>
     <li><a href="#" rel="close">Supprimer</a></li>
     <li><a href="#" onClick="walk(2);" rel="close">Param</a></li>
     <li class="bottom"></li>
  </ul>
</div>

Et voici ,la commande jQuery qui permet d'afficher le ToolTip (vous l'aurez compris, le DIV précédant s'affiche uniquement lorsque l'on clique sur un élément de la table HTML)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("a.clic", "#"+this.id).simpletooltip({click: true, effect: "slideDown", hideDelay: 0.4});

this.id correspond à l'ID de la ligne <tr>; par exemple 'trid_01'.


En fait, lors de la construction de la table HTML, j'exécute la commande jQuery précédante à chaque nouvelle ligne à joutée. La commande est identique à l'exception de 'this.id' qui varie.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
$("tr",table.tBodies[0]).each(function() {
   //Traitement sur la ligne : ajout de CSS, etc... et infobulles :
    $("a.clic", "#"+this.id).simpletooltip(...);
}

Lorsque je rajoute une nouvelle ligne manuellement, je réexécute la commande jQuery (pour suivre le même raisonnement que précédement), idem ici seul l'ID change et correspond à l'ID de la nouvelle ligne insérée.

Cela fonctionne bien sous FireFox mais pas sous IE !

Auriez-vous une idée??
Merci de votre aide.