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

Question

嗨，我创建了一个滑块，我想在其中为滑块提供一个按钮，应该如下所示

我使用以下代码创建了滑块的按钮。一切看起来都不错

#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，它可以正常工作