1

我的可排序列表有问题。我有两个容器,里面都有可排序的列表。两个容器之一具有固定位置。虽然我可以将一个项目从固定容器移动到另一个容器,但我不能将一个项目从非固定容器移动到固定容器。

$('ul').sortable({
  connectWith: $('ul'),
  items: '> li'
});

.fixed {
  position:fixed;
  left:100px;
  top:0;
}

<div class="fixed">
  <ul>
    <li>f1</li>
    <li>f2</li>
    <li>f3</li>
  </ul>
</div>
<div class="not-fixed">
  <ul>
    <li>nf1</li>
    <li>nf2</li>
    <li>nf3</li>
  </ul>
</div>

你可以在那里看到问题:http: //jsfiddle.net/mQP8p/

固定容器必须有固定位置(容器必须垂直和水平跟随页面)

有人以前见过吗?

谢谢 !

4

2 回答 2

0

诀窍是使“非固定” div 具有position: absolute. 一个工作小提琴:http: //jsfiddle.net/mQP8p/1/

于 2013-08-02T16:55:14.323 回答
0

看起来您的not-fixed类元素不是设置的宽度,所以它出现在fixed类元素上。这就是为什么即使在您拖动列表时它仍在对您的第一个列表进行排序fixednot-fixed尝试一些简单的事情,比如在类上设置宽度。

.not-fixed {
   width: 50px;
}

小提琴

注意:更改父 div 的宽度将影响您可以拖动元素的区域。尝试一下,看看哪种宽度最适合您的目的。

于 2013-08-02T16:57:23.523 回答