jQuery 可排序 +可删除的 z-index 问题

Question

我有一个问题，我的可排序对象的 z 索引不在我的可放置对象之上。

• 如果您访问 http://clareshilland.unknowndomain.co.uk/。
• 按 Ctrl + L 打开登录屏幕。
• 输入用户名 clare 和密码 shilland。
• 然后，如果您单击管理图库，它将加载到管理栏中。
• 将出现一个弹出缩略图视图，其中包含该图库中的所有照片。

问题是，当您将“宝丽来照片”从网格拖动到删除区域时，它们位于删除区域下方。

我尝试将删除区域放在与网格相同的 div 内，但这没有什么区别，我只是不知道此时该怎么做，所以任何帮助都将是巨大的帮助！

Answer 1

为您的 .sortable() 尝试以下选项：

{
  helper: 'clone',
  appendTo: 'body',
  zIndex: 10000 //or greater than any other relative/absolute/fixed elements and droppables
}

Answer 2

实际上，问题似乎是 z-index 和溢出的组合（我将其删除）。如果您将图库视图 CSS 更改为此，它就可以工作

#galleryView {
 background: white;
 bottom: 85px;
 left: 0;
 position: fixed;
 right: 0;
 top: 147px;
 z-index: 1000;
}

您可能希望有其他滚动到右侧而不是向下滚动的图库图像。

Answer 3

我不认为这是一个 z-index 问题，我认为问题是当你将 li 移动到删除区域时，它会被切断，因为它位于其父 ol 之外。我会尝试在鼠标悬停时立即将 li 移动到删除区域内的 ol （使用 droppable.over 事件），这可能会使其正确显示。