Geek asks and answers

Why does scrollWidth not work in Firefox in this case?

I am trying to create a simple border in Javascript and should get the full width of the contents of innerDIV in the following:

<div id="container" style="width: 100%; overflow: hidden;">
    <div id="innerDiv" style="direction: rtl; white-space: nowrap; overflow: visible; position: relative;">
        very long ... text
    </div>
</div>

I tried scrollWidth . It works fine in Chrome , but not in Firefox (where clientWidth is specified instead).

Here is a live demo: http://jsfiddle.net/5fPGy/3/ (try it in Chrome and Firefox)

Does anyone know why? and how to get this full width?

Thanks in advance.

+2
source share
2 answers

, . Firefox: https://bugzilla.mozilla.org/show_bug.cgi?id=833542.

Firefox scrollWidth clientWidth. Firefox 21.

scrollWidth Firefox: , . : http://jsfiddle.net/5fPGy/5/

var scrollWidth = $(ele).css("overflow", "hidden")[0].scrollWidth;
alert('clientWidt h = ' + ele.clientWidth + ',  scrollWidth = ' + scrollWidth  );
$(ele).css("overflow", "visible");

,

+4

:

docWidth = Math.max(
        Math.max(frameDoc.body.scrollWidth, frameDoc.documentElement.scrollWidth),
        Math.max(frameDoc.body.offsetWidth, frameDoc.documentElement.offsetWidth)                               
);
0

More articles: