2

親のオーバーフローを非表示に設定して、要素を水平方向にスクロールしようとしています。

これが私がこれまでに得たものです:

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が、固定幅の内部要素()があります。

内部要素の幅を明示的に設定せずにこれを実現する方法はありますか?

4

1 に答える 1

1

追加する場合:

.scroll {
    white-space:nowrap;
}

と置き換えwidth = $scroll.width()ます:

width = $scroll.get(0).scrollWidth

明示的な幅を設定しなくても正常に機能します。デモ

于 2012-10-30T18:39:33.740 に答える