danik.js, накидал по быстрому, в браузерах кроме хрома не пробывал
<!DOCTYPE HTML>
<html>
<head><style>
.column {
height: 150px;
width: 150px;
float: left;
border: 2px solid #666;
background-color: #ccc;
margin-right: 5px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
-ms-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: inset 0 0 3px #000;
-moz-box-shadow: inset 0 0 3px #000;
-ms-box-shadow: inset 0 0 3px #000;
-o-box-shadow: inset 0 0 3px #000;
box-shadow: inset 0 0 3px #000;
text-align: center;
cursor: move;
margin-bottom: 30px;
}
.column.over {
border: 2px dashed #000;
}
</style></head>
<body>
<div class="column" id='a' draggable="true" style="opacity: 1;"><header>А</header></div>
<div class="column" id='b' draggable="true" style="opacity: 1;"><header>B</header></div>
<script>
var b = document.getElementById('b'),
a = document.getElementById('a');
function dragleave (callback) {
b.addEventListener('dragenter', function () {
var self = this;
this.className = 'column over';
a.addEventListener('drag', function onDrag(e) {
console.log(document.elementFromPoint(e.clientX, e.clientY));
if(document.elementFromPoint(e.clientX, e.clientY) != self) {
a.removeEventListener('drag', onDrag);
callback();
}
});
});
}
dragleave(function () {
console.log('leave');
});
</script>
</body>
</html>