x
1
2
<html>3
<head>4
<meta charset="utf-8">5
<style type="text/css">6
#div1,7
#div2 {8
float: left;9
width: 100px;10
height: 35px;11
margin: 10px;12
padding: 10px;13
border: 1px solid #aaaaaa;14
}15
</style>16
<script>17
function allowDrop(ev) {18
ev.preventDefault();19
}20
21
function drag(ev) {22
ev.dataTransfer.setData("Text", ev.target.id);23
}24
25
function drop(ev) {26
ev.preventDefault();27
var data = ev.dataTransfer.getData("Text");28
ev.target.appendChild(document.getElementById(data));29
}30
</script>31
</head>32
<body>33
34
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">35
<img src="/images/logo.png" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31"></div>36
<div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>37
38
</body>39
</html>