| 123456789101112131415161718192021222324252627282930313233343536 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <style>
- #Box1{
- width:200px;
- height:100px;
- padding:10px;
- border:1px #ccc dashed;
- float:left;
- margin-right:10px;
- }
- </style>
- <script>
- function AllowDrop(event){
- event.preventDefault();
- }
- function Drag(event){
- event.dataTransfer.setData("text",event.currentTarget.id);
- }
- function Drop(event){
- event.preventDefault();
- var data=event.dataTransfer.getData("text");
- event.currentTarget.appendChild(document.getElementById(data));
- }
- </script>
- </head>
- <body>
- <div id="Box1" ondrop="Drop(event)" ondragover="AllowDrop(event)"></div>
- <img id="Img1" src="../static/img/battery.png" draggable="true" ondragstart="Drag(event)">
- <div style="clear:both;"></div>
- </body>
- </html>
|
