2009-11-18 2 views
1

Dans IE6, le graphique d'extension pour le nœud racine de la table n'apparaît pas. Si je place la souris à l'endroit correct à côté du texte des nœuds racine, je peux en fait cliquer sur l'expandeur.L'image jQuery TreeTable root node expander est cachée dans IE6, pourquoi?

L'extension apparaît pour tous les nœuds enfants.

La chose étrange est les exemples à l'TreeView site montrent l'image expanseur racine dans IE6. Je ne vois pas la différence entre le code des exemples et le mien. J'ai fait une comparaison côte à côte du CSS pour les éléments en question et rien ne me saute aux yeux.

Je n'ai pas de style supplémentaire que la feuille de style fournie avec le plug-in.

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#tree").treeTable(); 
    }); 
</script> 

-

<body> 
    <table id="tree"> 
     <tr id="node-1"> 
     <td>Parent</td> 
     </tr> 
     <tr id="node-2" class="child-of-node-1"> 
     <td>Child</td> 
     </tr> 
     <tr id="node-3" class="child-of-node-2"> 
     <td>Child</td> 
     </tr> 
    </table> 
</body> 

Répondre

2

Juste pour référence, depuis que je suis tombé sur ce trouble aussi ...

La première image parent ne montre pas parce que l'espace pour que l'image soit est trop petit, donc les fichiers treetable.css et treetable.js doivent être modifiés.

En jquery.treeTable.js, changer la ligne:

cell.prepend('<span style="margin-left: -' + options.indent + 'px; padding-left: ' + options.indent + 'px" class="expander"></span>'); Pour:

cell.prepend('<span class="expander"></span>'); 

Et jquery.treeTable.css, ajoutez les deux dernières lignes (marge gauche et padding- gauche) à ".treeTable tr td .expander":

.treeTable tr td .expander { 
background-position: left center; 
background-repeat: no-repeat; 
cursor: pointer; 
padding: 0; 
zoom: 1; /* IE7 Hack */  
margin-left: -3px; 
padding-left: 15px;} 

°°°°°°°°°°°°°°°°°°°°°°°°° Je n'ai pas modifié le code, la pointe ci-dessus provient de: http://javathoughts.capesugarbird.com/2009/03/jquery-tree-table-for-wicket.html

-VicSan.

0

Je suis d'accord avec la solution VicSan, bien que je préfère ne pas modifier le code source de TreeTable (donc je peux le mettre à niveau vers de futures versions sans avoir à refaire mes changements dans le nouveau code). Je vous suggère de ajouter simplement un padding-left dans l'attribut style de la première cellule de la première rangée de votre arbre table (la racine):

<body> 
    <table id="tree"> 
     <tr id="node-1"> 
     <td style="padding-left: 19px">Parent</td> 
     </tr> 
     <tr id="node-2" class="child-of-node-1"> 
     <td>Child</td> 
     </tr> 
     <tr id="node-3" class="child-of-node-2"> 
     <td>Child</td> 
     </tr> 
    </table> 
</body> 

Je mets 19px parce que c'est la valeur par défaut, mais, Si vous avez spécifié une autre valeur dans l'option indent (lorsque vous créez l'arbre-table avec .treeTable(...)), mettez celui-là.

Questions connexes