JSFiddle - React, Tailwind, and code Playground

by tomprogramming

HTML

<div id="target"><div>

CSS

#target {
    padding:20px;
    border:1px dashed #000;
    background: rgba(0,0,0,.2);
    border-radius:5px;
    margin:20px;
    
}

#target:hover {
background:rgba(50,90,120,.3);
}

JavaScript

var zone = document.getElementById("target");

zone.ondrop = function(e){
    debugger;
       console.log('drop');
    return false;
};


$(zone).on("drop", function(e){
    e.preventDefault();
    e.stopPropagation();
    console.log("jquery drop");
});