停止这个奇怪的 jQuery 故障

Question

我的问题是如何修复 jquery 中的这个奇怪的故障。

当我移动其中一个箱子时，它会使所有其他箱子向下射击，我不确定为什么会这样。有谁知道是什么导致了这个问题？

这个 fiddle 上面有我所有的代码

js:

$(document).ready(function(){
        $(function(){
            $('#container').sortable({
                connectWith: "#container",
            cursor: "move"
        }).disableSelection();
    });
});

HTML

<div id="container">
  <div class="container-item">Item 1</div>
  <div class="container-item">Item 2</div>
  <div class="container-item">Item 3</div>
</div>

CSS

lists {
    height: 200px;
    width: 300px;
    border: 1px solid #000000;
}

#container {
    background: lightgrey;
    width:500px;
    height: 50px;
}
.container-item {
  display: inline-block;
  width: 150px;
  height: 500px;
  background: lightblue;
  margin-right: 10px;
  margin-top: 0;
  position: relative;
  max-top: 50px;
}

Answer 1

只需将 float: left 添加到 .container-item。

Fiddle example

停止这个奇怪的 jQuery 故障

Stop this weird jQuery Glitch

javascript

jquery

jquery-ui

draggable