0

親 div 内で、左側にテキスト ラベルを、右側にスライダー (jQuery UI を使用) を配置したいと考えています。

スライダーが利用可能なすべてのスペースを占めるようにしたいのですが、この質問とは異なり、親 div の幅は不明です。

したがって、概念的には次のようにする必要があります(ここでは jsfiddle試行が壊れています):

<div id="parentDiv" style="width:100%">
<span>Unicorn awesomeness:</span><div id="unicornSlider"></div>
</div>

しかし、Chrome、FF3、IE8 で動作するものを簡単に手に入れることはできません。誰にもアイデアはありますか?

4

1 に答える 1

1

jQuery を使用して幅を設定してみてください。

$('#unicornSlider')
    .width($('#parentDiv').width() -$('#parentDiv span').width() - 20)
    .slider()

これを含めるようにフィドルを更新しました。(100% + パディングがウィンドウより大きかったため、親 div の幅を 90% に変更する必要もありました)。

更新:ブラウザー ウィンドウのサイズが変更されたときに、これがその幅を維持することに気付きました。で幅を再計算でき$(window).resize(function)ます。

于 2012-01-04T17:57:05.940 に答える