拖动并替换<ul>元素中的元素</ul>

Question

各位大家好，圣诞快乐， 我在新闻网站上创建了一些li元素，如下所示：

<ul class="other">
<li id="eco">
//news feed
</li>
<li id="tech">
//news feed
</li>
<li id="art">
//news feed
</li>
<li id="opin">
//news feed
</li>
</ul>

的CSS：

.other{
padding:0;
margin:0;
width:715px;
list-style:none;
font-family:tahoma;
margin-bottom:10px;
}

.other li{
text-align:right;
width:300px;
height:300px;
float:left;
margin-top:10px;
margin-left:20px;
padding:10px;
}

我写了一个jquery代码来拖动这些元素：

$(document).ready(function(){

$('#others li').draggable({
containment:'parent',
revert:'invalid',
opacity:'0.91',
cursor:'crosshair'
});

});

正如您所看到的（如果您已经使用jquery编程），此代码拖动元素，然后

返回到鼠标释放时的初始位置（同时移动不透明度）......好吧，我只是想知道当拖动的元素到达第二个元素的x和y位置时如何更改位置。

（注意：元素在x和y方向都是可拖动的）

谢谢

Answer 1

我相信您需要的是sortable：example here
请分析像portlet这样的演示示例，以便更好地理解它的功能。