拖动元件至第一位置

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

你可以尝试添加一个 '隐藏' 的元素上面，像这样：

<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 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; 
} 

这似乎与小提琴的工作。