Chrome Drag & Drop triggering :hover pseudo-class on surrounding elements
Have you considered jQuery UI? I know the less external resources the better, but jQuery UI detects when you are dragging, and then (as "The Reveller" said), you could add a class to body and specify
.bodyIsDragging{ pointer-events: none }
Can you add a class to your html/body tag while dragging? If so you could potentially use
.is-dragging * { pointer-events: none;}
where .is-dragging is the class on your body/htmland then override on the element you are currently dragging.
This worked for me with (in a ugly way):
CSS:
.is-dragging { pointer-events: none;}
JS: (on the "drop" event)
$('body').addClass('is-dragging');if (event.clientY < separatorY) dragged.insertBefore(target);else dragged.insertAfter(target);setTimeout(function(){ $('body').removeClass('is-dragging');}, 1);