jqueryui：可拖放的背景？

我正在尝试创建一个垃圾桶，在你把一些东西放在那里之后，你可以简单地打开它，把任何被丢弃的东西从垃圾桶里拖出来，把它扔到垃圾桶外面

我设置的方式是，我的web应用程序有一个垃圾桶图标，我在其中放置物品，单击垃圾桶打开一个包含垃圾物品的框，并在黑色透明背景中淡入淡出，使其他内容变得模糊，因此您只需关注垃圾桶框

代码本质上是

<div id="background"></div>
<div id="trashcanContainer">
   <ul id="items">
     <li>item1</li>
     <li>item2</li>
   </ul>
</div>

项目1
项目2

背景CSS设置为固定位置、100%宽度和高度，并设置为可拖放。问题是，当我从垃圾桶中拖出一些东西并把它放在背景上时，即使我把它放在垃圾桶顶部，它也会被移除。基本上，jQuery不理解垃圾容器div位于后台div之上（因此不是可拖放的一部分），即使我定义了一个高于后台的z索引

---

有什么办法可以让我完成这项工作吗？

确保

#垃圾箱

绝对定位为

位置：绝对

或

位置：固定

，否则

z-index

将无效。

尝试了这两种方法，但都没有成功。即使我将垃圾箱包装在背景中，它也不起作用。