I am building a drag and drop website. But I'm facing a problem to drop the element before or after, above or below the other element. I have watched a tutorial about it that's working but I cannot attach the code to my code as I'm totally new to java. Here is my drag and drop code:
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data));
}#div1, #div2 {
float: left;
width: 200px;
height: 300px;
margin: 10px;
padding: 10px;
border: 1px solid black;
}<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
<button draggable="true" ondragstart="drag(event)" id="drag1">btn1</button>
<button draggable="true" ondragstart="drag(event)" id="drag2">btn2</button>
<button draggable="true" ondragstart="drag(event)" id="drag3">btn3</button>
</div>
<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>Answer in javascript please