水平滾動元素，寬度不指定

Question

我試圖水平滾動一個元素，其父對象的溢出設置為隱藏。

到目前為止，這是我得到的：

HTML：

<div class="parent">
    <div class="scroll">This element's text scrolls horizontally.</div>
</div>​

CSS：

.parent {
    overflow: hidden;
    height: 36px;
}
.scroll {
    width: 1500px;
}

JS：

$(function(){
    var $parent = $('.parent'),
        $scroll = $('.scroll'),
        width = $scroll.width(),
        scroll = function (){
            $scroll.animate({
                'margin-left': -width
            }, 12000, function () {
                $scroll.css('margin-left', $parent.width());
                scroll();
            });
        };

    scroll();
});​

工作演示： http : //jsfiddle.net/hTnNk/

---

上面的代碼可以完美地工作，但是內部元素（ .scroll ）具有固定的寬度。

有什么方法可以在不顯式設置內部元素寬度的情況下完成此操作？

Answer 1

如果添加：

.scroll {
    white-space:nowrap;
}

並將width = $scroll.width()替換為：

width = $scroll.get(0).scrollWidth

如果沒有明確的寬度設置，它將可以正常工作。 演示