我正在构建一个 UI,其中需要有两个或更多可调整大小且可拖动的 DIV。 我面临的问题是,当您调整 div 的大小时,最初位于其下方的所有其他 div 都会移动(更改其位置)。请参阅https://jsfiddle.net/2f8g93nn/4/我在那里写了一个例子来说明我的意思。在该示例中,如果将第二个 div 向右移动并调整第一个 div 的大小,则第二个 div 的位置将会改变。
jsfiddle.net 中的 HTML:
<!doctype html>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<div class="Element" id = "FirstDiv" class="ui-widget-content">
<p>First DIV</p>
</div>
<div class="Element" id = "SecondDiv" class="ui-widget-content">
<p>Second DIV</p>
</div>
jsfiddle.net 中的 JavaScript:
$(function() {
$( ".Element" ).draggable();
$( ".Element" ).resizable();
});
jsfiddle.net 中的 CSS:
.Element {
width: 150px;
height: 150px;
padding: 0.5em;
border:1px solid black;
}
最佳答案
就我的观点而言,让事情变得简单,你为什么不使用标签...
这里是演示代码:https://jsfiddle.net/SeokKuan/2f8g93nn/8/
<textarea style="height: 100px;" placeholder="First Content"></textarea><br>
<textarea class="form-control" style="height: 100px;" placeholder="Second Content"></textarea>
nn/8/
关于javascript - 可调整大小导致其下方的其他元素移动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30094425/