HTML5 드래그 가능한 setDragImage가 Chrome 캔버스에서 작동하지 않습니다.

Question

기본 HTML5 드래그 앤 드롭 API에서 드래그 이미지로 캔버스를 사용하려고합니다.

문제는 Firefox에서는 작동하지만 Chrome에서는 작동하지 않으므로 (58) 문제를 정확히 알 수 없습니다.

코드 : 내가 잘못 https://jsfiddle.net/196urLwd/5/

---

<div id="thing" draggable="true">DRAG ME</div> 

---

function onDragStart(event){ 

    var canvas = document.createElement('canvas'); 
    var context = canvas.getContext('2d'); 

    canvas.width = 100; 
    canvas.height = 20; 

    context.fillStyle = '#333333'; 
    context.fillRect(0, 0, canvas.width, canvas.height); 

    context.fillStyle = '#999999'; 
    context.font = 'bold 13px Arial'; 
    context.fillText('DRAGGING...', 5, 15); 

    event.dataTransfer.setData('text', 'lorem ipsum'); 
    event.dataTransfer.effectAllowed = 'copy';  
    event.dataTransfer.setDragImage(canvas, -15, 9); 

}; 

var theThing = document.getElementById('thing'); 
theThing.addEventListener('dragstart', onDragStart, false); 

을 뭐하는 거지?

Answer 1

크롬

document.body.append(canvas); 

그냥 내가 그것을 시도하지 않은 이유는 일부 CSS를

canvas{ 
    position:absolute; 
    left:-100%; 
} 

https://jsfiddle.net/196urLwd/6/