2016-09-27 7 views
4

나는 html5 드래그 앤 드롭을 사용하고 있습니다.에 대한 브라우저의 응답 dragover - html5 drag and drop

주어진 웹 페이지에서 이미지 또는 링크를 드래그하면 브라우저 창이 dragover 이벤트를 인식하고 있습니다.

예를 들어 이미지를 브라우저 탭 위로 끌면 브라우저가 창을 전환합니다. 예를 들어 링크를 북마크로 드래그하는 경우에도 동일하게 작동합니다.

이제 사용자 정의 드래그 가능 요소를 드래그하면 브라우저의 반응이 없습니다. 이 동작을 변경하는 방법이 있습니까?

+1

코드를 남겨 두겠습니다. –

답변

4

나는 당신이 달성하고 싶은 것을 이해하지 못하지만 문서 나 창 밖으로 사용자 정의 요소를 옮기면 무언가를하고 싶다고 생각합니다.

핸들을 dragleave 또는 그와 비슷한 것으로 바인딩해야합니다.

var dropTarget = $('.dropTarget'), 
    html = $('html'), 
    showDrag = false, 
    timeout = -1; 

html.bind('dragenter', function() { 
    dropTarget.addClass('dragging'); 
    showDrag = true; 
}); 
html.bind('dragover', function(){ 
    showDrag = true; 
}); 
html.bind('dragleave', function (e) { 
    showDrag = false; 
    clearTimeout(timeout); 
    timeout = setTimeout(function(){ 
     if(!showDrag){ dropTarget.removeClass('dragging'); } 
    }, 200); 
}); 

나는 그런 당신을 위해 일할 수 있다고 생각하지만, 더 도움을 당신이 당신의 문제의 설명을 확장해야합니다 : 여기 example from another question입니다.

또한 HTML5 drag and drop docs here