Question

我正在使用jQuery的resizable（）。我希望能够在右上角制作一个div棒，而另一个div始终在左下角。我希望将这两个div作为可调整大小的句柄ne和sw。

如何让$(".td")和$(".tl")始终位于$(".nWrapper")的右上角和左下角？

HTML：

<div class="lWrapper">
    <div class="nWrapper">
        <div class="tWrapper">
            <div class="td"></div>
            <div class="tl"></div>
        </div>
    </div>
</div>

的CSS：

.lWrapper{
    position: relative;
    background-color: #ff0000;
    width: 200px;
    height: 200px;
}
.nWrapper{
    position: absolute;
    background-color: #00ff00;
    width: 200px;
    height: 100px;
}
.tWrapper{
    position: absolute;
}
.td{
    position: relative;
    background-color: #0000ff;
    width: 12px;
    height: 12px;
    left: 0; /*want it left bottom*/
    bottom: 0;
}
.t1{
    position: relative;
    background-color: #ff6600;
    width: 12px;
    height: 12px;
    float: right; /*want it right top*/
    top: 0;
}

Example Fiddle

Answer 1

您需要将包装div（nWrapper）设为position: relative，将较小的div设为position: absolute，并将这两个值设为左/右/上/下值。

点击此处：https://jsfiddle.net/ze9go151/2/

胶水2分为右上角和左下角

1 个答案: