jQuery Sortable + Droppable z-index 问题答案

【问题标题】：jQuery Sortable + Droppable z-index problemjQuery Sortable + Droppable z-index 问题
【发布时间】：2011-02-09 11:25:36
【问题描述】：

我有一个问题，我的可排序对象的 z-index 不在我的 droppable 之上。

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

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

【问题讨论】：

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

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

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

您可能希望有更多的画廊图像向右滚动而不是向下滚动。

【讨论】：

移除溢出意味着它不会向下滚动。我认为那很重要。并且您的 z-index 消除了阴影，虽然不那么重要，但它失去了效果。
测试您的代码非常困难，因为我不能只保存页面并搞乱它......只是让您知道。
是的，如果我删除溢出，则没有可滚动性，有时视图中可能有 50-100 个图像。 @fudgey 感谢您的反馈，我不知道有更好的方法来呈现它，因为它全部是 ajax'y 也许我可以建议使用 firebug 但我认为除了使用控制台之外它在这种情况下不会真正受益.

【解决方案3】：

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

【讨论】：