使用 jQuery 拖动图层答案

【问题标题】：Dragging layers with jQuery使用 jQuery 拖动图层
【发布时间】：2011-06-27 22:34:37
【问题描述】：

我的屏幕上有两个具有不同 Z-index (1&2) 的图层 (DIV)。我希望能够使用 jQuery 拖动下层（z-index 为 1 的层）。我将如何实现这一目标？如何将鼠标移动和点击传递到下层？

【问题讨论】：

您是否希望将 z-indexed 2 div 捕获的鼠标事件传递给它下方的 z-indexed 1 div？ z-indexed 1 div 是 z-indexed 2 div 的容器吗？

【解决方案1】：

您可以使用 jQuery UI 轻松地将 DIV 设置为可拖动。只需调用

$("#mydiv").draggable();

z-index 将是您在 CSS 中指定的 DIV。确保在两个 DIV 上都设置了位置属性（绝对或相对，没关系）。如果要将拖动事件传递给底层，则捕获顶层的事件，然后使用 .trigger() 将其传递，如下所示。

$("#top").mousedown(function(event){
    $("#bottom").trigger(event);
});

您可能还应该添加一些代码来检查，在顶层的 mousedown 上，鼠标实际上是在较低的层上。

【讨论】：

谢谢，但这不是我要找的，我已经知道了。我的意图是用鼠标拖动/移动“下层”。如果另一个 DIV 在该层上，则没有机会移动下层，我期待找到一种方法将鼠标单击/移动传递到下层并能够拖动该层。