Html5 DragDrop

Set the dropTarget property of the jqxDragDrop. Author: http://jqwidgets.com

by jqwidgets

HTML

<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="https://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div style="width: 50px; height: 50px; border: 1px solid #A67E3A; background-color: #FFC663;" id="element">
    <div style="margin-left: 3px; margin-top: 20px; font-size: 10px; font-family: Verdana;">Drag me</div>
</div>
<div style="width: 100px; margin-top: 200px; height: 100px; background: yellow;" id="dropTarget" class="dropTarget">Drop here</div>
<div id="log"></div>

JavaScript

$("#element").jqxDragDrop({
    feedback: 'clone',
    tolerance: 'fit',
    dropTarget: ".dropTarget"
});

$('#element').on('dropTargetEnter', function (event) {
    $("#log").html("dropTargetEnter raised");
});