Detecter l'overflow d'un DIV dans un TD

Bonjour à tous,

Je cherche à faire une liste sous forme d'un tableau (avec plusieurs colonnes) d'une largeur de 100%.
Jusque là rien d'exptionnelle.

Les elements contenus dans les cellules peuvent être plus large que l'espace prévu. J'ai donc décidé d'appliqué le mode overflow:hidden;

exemple concret :

<td style="width:25%;">

  <div style="float:left; clip: rect(0px 0px '+ww+' 21px); cursor:pointer; text-overflow:ellipsis; width:'+ww+'; overflow:hidden; white-space:nowrap;">Mon contenu qui peut etre plus large</div>

</td>

Jusque là toujours pas de soucis.


Je voudrais maintenant savoir comment détecter si le contenu est effectivement plus long que l'espace qui lui est aloué (en javascript).
Si j'arrive à le détecté je mettrai en place des '...' a la fin de la cellule pour montrer que le terme est coupé et aussi un info bulle montrant le contenu complet.

Mais pour l'instant la seule solution trouvé est de copie en jaavscript via innerHTML le contenu dans un div sans overflow, de mesuré sa largeur avec offsetWidth et de comparé avec la largeur effective d ela cellule.

Mais ni aurrait-il pas un moyen moins couteux?

Toutes les idées sont les bienvenu...


Merci à tous et bravo a codesource 

Oups petite correction dans le code (il y avait un mix avec du php encore) concernant la style clip
Fallait lire :

<td style="width:25%;">

  <div style="float:left; clip: rect(auto auto auto auto); cursor:pointer; text-overflow:ellipsis; width:'+ww+'; overflow:hidden; white-space:nowrap;">Mon contenu qui peut etre plus large</div>

</td>

Mais ca change pas grand chose au problème.

Ma solution :

http://www.javascriptfr.com/code.aspx?ID=34109