css z-index 属性 即使在有位置的 div 上也不起作用

Question

我正在尝试使可拖动的 div 在拖动时在其他所有内容上可见。

这是我的jquery触摸打卡代码：

$('#draggable').draggable({
  zIndex: 99999999999,
  drag: function(event){...},
  helper: 'clone',
  position: 'absolute',
  owerflow: 'hidden'
})

我知道 z-index 仅适用于具有位置的元素，因此我也将 position:relative 添加到其他 div。但它仅在我位于可拖动元素的父级 div 上时才有效。我使用了一个包含很多 类 的巨大 css 文件，所以我无法复制它的适当部分。

Answer 1

您不需要 css 中的任何位置，只需为 helper 创建一个自定义函数，在其中将实际拖动的元素添加到包含放置元素的外部元素。

$('#draggable').draggable({
  zIndex: 20,
  drag: function(event){...},
  helper: function(){
    $("#outerElement").append($("#draggable").clone().attr('id', 'itWorks'))
    return $("#itWorks");
  },
})