티스토리 뷰



: HTML5의 <canvas> 위로 이미지를 드래그앤 드랍을 할 때에는 보통


canvas.addEventListener("drop", function (e) {

    alert("dropped!");

    e.preventDefault();

});


: 이렇게 drop이벤트를 listen하게 되는데 drop 이벤트만 이렇게 처리하게 된다면 크롬, 사파리 등에서는 잘 동작하지만 파이어폭스에서는 왠지 이 drop 이벤트를 먹어버리고 브라우져 자체가 이미지를 열어버리게 된다.


: 이럴 때에는 dragover의 기본 동작도 방지시켜주면 파이어폭스에서도 drop 이벤트가 정상적으로 동작하게 된다.


canvas.addEventListener("dragover", function (e) {

    e.preventDefault();

    return false;

}


: 해당 캔버스 위에 이제 드랍을 하게 되면 이벤트 호출이 제대로 된다.


끝.

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
«   2024/03   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
글 보관함