jquery slider旁边的文本标签（div宽度未知）

Question

在父div中，我想在左边有一个文本标签，在右边有一个滑块（使用jQuery UI）。

我希望滑块占用所有可用空间，而不像this question，父div的宽度是未知的。

所以在概念上它应该是这样的（jsfiddle here破碎的尝试）：

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

但我不能得到任何容易的是在Chrome，FF3和IE8的作品。有没有人有任何想法？

Answer 1

你可以尝试设置使用jQuery宽度：

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

I'ev更新您的fiddle包括这个。 （我还必须将父div的宽度更改为90％，因为100％+填充比窗口大）。

更新：我注意到，当浏览器窗口调整大小时，这会保持这个宽度。您可以使用$(window).resize(function)重新计算宽度。