使用HTML5拖放操作時，如何在拖放區域上拖動圖像？

Question

所以這就是我想要做的。我希望能夠拖動元素，並使其在拖放區域之上時將其默認拖動圖像動態更改爲不同的圖像。

Answer 1

您可以使用dataTransfer.setDragImage方法設置拖動圖像。它存在於所有拖動事件的事件對象中，包括dragover事件。

一些基本的代碼如下：

dropElem.ondragover = function(e) { 
    if (e.stopPropagation) { 
     e.stopPropagation(); //Stops some browsers from redirecting. 
    } 
    var dragIcon = document.createElement('img'); 
    dragIcon.src = 'image.png'; 
    dragIcon.width = 100; 
    e.dataTransfer.setDragImage(dragIcon, 0, 0); 
};