Question

这是我第一次使用这个插件。

我想在它被拖动时添加一堆元素。我使用z-index和position relative。

    onstart: function (event) {

    //get max z-index on page   
      var maxZ = Math.max.apply(null, 
      $.map($('body > *'), function(e,n) {
        if ($(e).css('position') != 'static')
          return parseInt($(e).css('z-index')) || 1;
      }));

        event.target.style.background = 'red';
        event.target.style.zIndex = maxZ + 1; 
        event.target.style.position = 'relative'; 
    },

有更有效的方法吗？

original drag and drop demo

my edited drag and drop demo with stacking

Answer 1

如果元素不也用作dropzones，那么您的解决方案效果很好。当dropzones重叠时，interact.js会选择DOM中最深的元素，因此应该出现在其他dropzones ulness上方，某些CSS属性会更改绘制顺序（例如position，transform，{{1如果重叠的dropzones与z-index重新排序，则可能会发生丢弃目标看起来不正确。

如果您定位的元素都是兄弟姐妹且所有元素都有z-index或absolute fixed（在任何拖动发生之前），则会向其添加一个元素＆＃39 ;父母应该在不使用position的情况下将其带到其他人面前，因此丢弃检查应该可以正常工作。

z-index

interact.js拖动项目移动到顶部

1 个答案: