将元素绝对定位在固定位置的容器内

Question

是否可以将元素绝对定位在固定位置的容器内？ 例如：

<div style="position:fixed; left:0; top:0">
    <div style="position:fixed; left:0; top:0;"></div>
    <div style="position:fixed; left:200px; top:120px;"></div>
</div>

我希望能够使用jQuery将容器div左右移动（以及它的子代），但这显然不起作用（移动容器的left属性不会影响子代）。

我尝试过这样的事情：

<div style="position:fixed; left:0; top:0">
    <div style="position:relative; width:100%; height:100%;">
        <div style="position:fixed; left:0; top:0;"></div>
        <div style="position:fixed; left:200px; top:120px;"></div>
    </div>
</div>

...但是它不起作用。 我知道我最终可以放下容器并同时为每个固定位置的孩子设置动画，但是我真的不希望这样做。 我可能最终会添加更多的子代，这意味着要管理每个子代的动画/动作（现在我想到了，我可以为每个子代添加一个类，并让jQuery动画化所有子代的left属性。该类的出现，但如果可能的话，我还是更愿意解决我最初的问题）。

欢迎黑客！

Answer 1

为孩子使用亲戚，不固定。

<div style="position:fixed; left:0; top:0">
    <div style="position:relative; left:0; top:0;"></div>
    <div style="position:relative; left:200px; top:120px;"></div>
</div>

Answer 2

子项应绝对放置（因为它们绝对位于固定容器中）。

观看此演示： http : //jsfiddle.net/74dE7/2/

#fixed-box {
    position: fixed;
    height: 300px;
    width: 300px;
    background: red;
    right: 10px;
    top: 10px;
}

#absolute-box {
    position: absolute;
    left: 10px;
    bottom: 10px;
    background: blue;
    height: 50px;
    width: 50px;
}

<div id="fixed-box">
    <div id="absolute-box">
    </div>
</div>