Question

我使用原生HTML5拖放API会在页面上拖动一些元素。我遇到的问题是被拖动的元素相当大，它的当前位置模糊了我的一些放下目标。当我将拖动的元素设置为无显示或隐藏可见性或指针事件为无，或者甚至位置绝对和左-10000px时，会立即在该元素上触发dragend事件。

有没有办法克服它？

Answer 1

您是否尝试创建一个像阴影一样的临时元素？

function drag(ev) {
    var shadow = createShadowElement();
    var element = document.getElementById(ev.target.id);
    element.appendChild(shadow);

    ev.dataTransfer.setDragImage(shadow, 0, 0);
    ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    var element = document.getElementById(data);
    ev.target.appendChild(element);
}

function dragEnd(ev) {
    removeShadowElement();    
}

见http://jsfiddle.net/89gs21jj/1/

拖动元素会遮挡放置目标

1 个答案: