Browser response to dragover - html5 drag and drop

I am using html5 drag and drop.

When I drag an image or link from any web page, the browser window recognizes the dragover event.

For example, dragging an image through a browser tab makes the browser switch the window. The same thing works, for example, when dragging bookmark links.

Now when I drag my custom drag and drop item, there is no reaction in the browser. Is there any way to change this behavior?

+4
source share
1 answer

, , , - , .

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 );
});

, , .

HTML5

+4

Source: https://habr.com/ru/post/1655964/


All Articles