Question

<div class='parent'>
<div class='children'>1234</div>
<div class='children'>5678</div>
<div class='children'>9101</div>
<div class='children'>I WANT TO BE FIRST</div>
</div>

js

$('.parent').sortable({
axis: "y",
containment: "parent"
});

如果将containment设置为parent，则会将元素拖到第一个位置时出现问题。我需要这个设置，但我还需要将一些元素移到顶部。但它的接缝是没有足够的空间来做到这一点。有时它是可能的，但主要是 - 它不是。

我尝试在parent添加顶部/底部填充/边距 - 但没有成功。

任何解决方法？

这是jsfiddle

Answer 1

你可以尝试添加一个隐藏的＆＃39;上面的元素，如下：

<div class='parent'>
  <div class='children hidden'></div>
  <div class='children'>1234</div>
  <div class='children'>5678</div>
  <div class='children'>9101</div>
  <div class='children'>I WANT TO BE FIRST</div>
</div>

用于css：

.hidden {
  visibility: hidden;
  height: 0;
}

如果拖过隐形元素，它就不会被释放。

这里是jsfiddle

Answer 2

你可以添加一个包含div并为其设置包含吗？ e.g：

<div id="outer">
<div class='parent'>
<div class='children'>1234</div>
<div class='children'>5678</div>
<div class='children'>9101</div>
<div class='children'>I WANT TO BE FIRST</div>
</div>
</div>

以及：

$('.parent').sortable({
axis: "y",
containment: "#outer"
});

和

 #outer {
   padding-top: 1px;
 }

这似乎适用于小提琴。

将元素拖动到第一个位置

2 个答案: