javascript - 为什么在Firefox中，scrollWidth在这种情况下不起作用？

我正在尝试使用Javascript制作一个简单的字幕，并且需要在以下内容中获取innerDIV的完整内容宽度：

<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>

我尝试了scrollWidth。它在Chrome中效果很好，但在Firefox中效果不佳（而是提供clientWidth的值）。

这是一个现场演示：http://jsfiddle.net/5fPGy/3/（在Chrome和Firefox中尝试）

有人知道为什么吗？以及如何获得整个宽度？

提前致谢。

最佳答案

我遇到了同样的问题，并且为您的问题找到了答案。这是Firefox中的错误：https://bugzilla.mozilla.org/show_bug.cgi?id=833542。

Firefox为scrollWidth返回clientWidth值。应该在Firefox 21中修复。

现在，我使用了一种变通方法来在Firefox上获取正确的scrollWidth：将溢出设置为隐藏，获取正确的scrollWidth并将溢出恢复为可见。请参阅：http://jsfiddle.net/5fPGy/5/

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

祝你好运

安德烈