删除其他DIV时,动态创建的DIV不保持位置

时间:2018-09-30 05:37:03

标签: javascript jquery html css

很难解释,但是我已经构建了一个便签应用程序。通过按钮动态插入300px x 300px便笺的HTML。然后,您可以通过单击注释中的X来删除该注释。

删除记事时出现我的问题。如果我创建一些便笺并在屏幕上移动它们,然后将它们一一删除,则它们会移动位置。它们唯一保持设置的位置是当我以相反的顺序删除它们时创建的。

使用jQuery UI的.draggable()

这是我的jsfiddle演示https://jsfiddle.net/29gf8wh3/1/

请注意html

typeOf

注意CSS

<div id='canvas'>
<div class='note'>
    <div id='note_menu'>
        <i class="btn_close fas fa-times"></i>
        <i class="float-right fas fa-bars"></i>
        <textarea class='note_text'></textarea>
    </div>
</div>
</div>

我的脚本

.note {
background-color: #F4F4F0;
-webkit-box-shadow: 10px 10px 39px -9px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 10px 10px 39px -9px rgba(0, 0, 0, 0.75);
box-shadow: 10px 10px 39px -9px rgba(0, 0, 0, 0.75);
width: 300px;
height: 300px;
}

$('。note')。draggable();

$(document).ready(function () {

1 个答案:

答案 0 :(得分:2)

使用固定在类注释上的css jQuery位置。

  $('.note').draggable();
  $('.note').css('position','fixed');

https://codepen.io/anon/pen/XxJyBj