如何在动态可变的div中定位按钮div？

Question

您好我创建了一个滑块，我想在滑块上给出一个按钮，它应该是这样的

我使用以下代码创建了The Button To the slider.all看起来不错

#sliderdiv 
{
    top:30%;     
    right: -2px; 
    position:fixed;
    width:300px;
    height:270px;
    margin-right: -300px;
}
#buttondiv
{                  
    height:110px;
    width:40px;
    background:aqua;
    position:absolute;
    float:left;
    margin-left: -39px;                                     
}

<div id="sliderdiv">
    <div id="buttondiv">
    </div>
</div>

现在，当滑块的宽度发生变化时，按钮会像

一样从中移动

我知道这是因为我给按钮div的 margin-left 值。这是我的问题是有一种方法来正确定位它，即使滑块div是自动的改变？

或者有没有办法将按钮放在滑块div上而没有任何间隙而且没有更改按钮div值？

...谢谢

这是小提琴http://jsfiddle.net/sNgxR/3/

Answer 1

检查一下：

var mywidth = $("#buttondiv").width();
$("#buttondiv").css("margin-left", -mywidth);

http://jsfiddle.net/sNgxR/4/

编辑按钮的宽度并点击“运行”。

如果更改滑块的val，则可以正常工作