nouvelle ligne dans <td title="">

Question

Duplicata possible :
Comment utiliser un retour chariot dans une infobulle HTML ?

J'aimerais savoir s'il est possible de forcer l'affichage d'une nouvelle ligne dans l'infobulle lorsque l'on utilise la propriété title d'un TD. quelque chose comme

<td title="lineone \n linetwo \n etc...">

Cela peut-il être fait ?

Answer 1

Cela fonctionne avec Internet Explorer, mais pas avec Firefox,

<img src="'../images/foo.gif'" 
  alt="line 1&#013;line 2" title="line 1&#013;line 2">

Essayez une bibliothèque d'infobulles JavaScript pour un meilleur résultat, quelque chose comme OverLib .

Answer 2

Une façon d'obtenir un effet similaire serait d'utiliser le CSS :

<td>Cell content.
  <div class="popup">
    This is the popup.
    <br>
    Another line of popup.
  </div>
</td>

Puis utilisez ce qui suit dans le CSS :

td div.popup { display: none; }
td:hover div.popup { display: block; position: absolute; }

Vous devrez ajouter des bordures et un arrière-plan pour que la fenêtre contextuelle ait un aspect décent, mais cela devrait vous donner une idée. Elle présente cependant quelques inconvénients, par exemple le popup n'est pas positionné par rapport à la souris mais par rapport à la cellule qui le contient.

Answer 3

La recommandation du W3C sur le langage de balisage extensible (XML) 1.1 dit ceci

" Tous les sauts de ligne DOIVENT avoir été normalisés en entrée de #xA comme décrit dans 2.11 Traitement des fins de ligne, de sorte que le reste de cet algorithme fonctionne sur du texte normalisé de cette manière. "

Le lien est le suivant http://www.w3.org/TR/2006/REC-xml11-20060816/#AVNormalize

Vous pouvez alors écrire :

<td title="lineone &#xA; linetwo &#xA; etc...">

Answer 4

Cela devrait fonctionner, mais c'est spécifique à Internet Explorer :

<td title="lineone
linetwo 
etc...">

Comme d'autres l'ont mentionné, la seule autre solution consiste à utiliser une infobulle basée sur HTML + JavaScript si seule l'infobulle vous intéresse. Si c'est pour des raisons d'accessibilité, vous devrez probablement vous en tenir à des lignes simples pour des raisons de cohérence.

Answer 5

J'utilise la méthode jQuery indiceTip plugin pour cela.