Comment obtenir la largeur débordés d'un élément dans une page Web

Question

J'ai deux divs comme si

<div id="parent" style="width:100px:overflow:hidden;"> 
    <div id="child"> 
     tooooooooooooooooooooo much content to fit in parent 
    </div> 
</div> 

Je met à jour dynamiquement le contenu de l'enfant et le défilement à l'aide de jQuery. Je voudrais être capable de trouver la largeur de l'enfant, donc je sais quand arrêter de défiler. Le problème est que la largeur réelle de l'enfant une fois que le contenu débordé est présent, est plus large que même l'écran (semble être d'environ 2500 pixels avec le contenu du test en cours). La bordure de l'élément, si elle est définie, ne s'étend pas à la largeur réelle du contenu, le texte déborde au-delà de la bordure visible.

$('#child').width

Utilisation jQuerys, le clientWidth, scrollWidth (grâce bobince) et offsetWidth propriétés tout max à 1024px (qui est la largeur de mon moniteur). Est-ce que quelqu'un sait d'une façon de savoir à quelle largeur le contenu des éléments est compris le débordement? Si cela aide, l'application que je construis fonctionnera dans un environnement de type kiosque, donc une solution de Firefox seulement (même une version nocturne) est bien.

Mise à jour: scrollWidth sur les travaux parentaux, j'aurais dû lire plus attentivement, merci encore bobince.

Answer 1

document.getElementById('parent').scrollWidth 

scrollWidth est une extension IE que, historiquement, a été moins bien supportée que offsetWidth. Cependant de nos jours tous les navigateurs de bureau modernes l'incluent.

Answer 2

En utilisant JQuery, vous pouvez le faire:

$('#parent')[0].scrollWidth