親のオーバーフローを非表示に設定して、要素を水平方向にスクロールしようとしています。
これが私がこれまでに得たものです:
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
が、固定幅の内部要素()があります。
内部要素の幅を明示的に設定せずにこれを実現する方法はありますか?