当您使用jquery将可排序项向上拖动时，如何使其在上方显示div？

我要一张单子

议程项目1 项目2

这将是短的，当你拖动项目2，使绿色的div高于红色div。这意味着z指数将更高

是我的链接到目前为止看到它的工作。。

提前谢谢大家

编辑：

最后一件事！当我把第三件物品放在第二件上面时，我希望第一件物品仍然在上面，然后是第三件，然后是第二件

---

它就像一个排序的东西，你把项目3拖上去，然后把项目3拖上去，你把项目2拖到下面的项目1，然后第一个是项目1，然后第二个是项目2，最后一个是项目3。

如果我正确理解了你的问题，你可以使用jQuery UI sortable（）

看到这个了吗

JQUERY

$(function() {
    $( "#sortable" ).sortable({
        start: function(event, ui) {
            // clear z-index
            $('span[class^="target_"]').css({
                "z-index" : '0'
            });

            // bring up the target
            var item = ui.item.attr('class').split(' ')[0];
            $('.' + item.replace("item", "target")).css({
                "z-index" : 10000
            });
        },
    });

    $( "#sortable" ).disableSelection();
});

HTML

<ul id="sortable">
  <li class="item_1 ui-state-default">
    <span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1 up
  </li>
  <li class="item_2 ui-state-default">
    <span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2 up
  </li>
</ul>
<span class="target_1" style="background:red;padding:30px; position:absolute; float:left;">1</span>
<span class="target_2" style="background:green; padding:30px; margin-left:10px; position:absolute; float:left;">2</span>

议程项目1


项目2


1.
2.

---

注意我添加了类

项x

和类

目标x

以允许元素识别。

我可以说我爱你吗！：谢谢，太好了！我放了第三件物品，现在分类不正确。。因为我把项目3放在项目1和项目2之间，而分区3位于其他分区之上！它应该在另外两个分区之间@用户1035890，我去看看！请稍等@用户1035890，工作正常，问题是

背景色和
左边距
与
目标_2和
目标_3
相同，请参阅此更新！同样，你没有意识到变化！但它正在做！