HTML5 includes a drag and drop API that allows you to make elements draggable and define drop zones. You can use JavaScript event handlers to handle drag and drop events. Here's an example:
Drag me
Drop here
<script>
function dragStart(event) {
event.dataTransfer.setData("text", event.target.id);
}
function allowDrop(event) {
event.preventDefault();
}
function drop(event) {
event.preventDefault();
const data = event.dataTransfer.getData("text");
const draggedElement = document.getElementById(data);
event.target.appendChild(draggedElement);
}
</script>