uim.html.dragdrop source code

1 module uim.html.dragdrop;
2 
3 import uim.html;
4 
5 /*<!DOCTYPE HTML>
6 <html>
7 <head>
8 <script>
9  function allowDrop(ev)  {
10    ev.preventDefault();
11  }
12  
13  function drag(ev)  {
14     ev.dataTransfer.setData("text", ev.target.id);
15  }
16  
17  function drop(ev)  {
18     ev.preventDefault();
19    var data = ev.dataTransfer.getData("text");
20    ev.target.appendChild(document.getElementById(data));
21  }
22  </script>
23 </head>
24 <body>
25 
26 <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
27 
28 <img id="drag1" src="img_logo.gif" draggable="true" ondragstart="drag(event)" width="336" height="69">
29 
30 </body>
31 </html> 
32 */
33 /*
34 <!DOCTYPE HTML>
35 <html>
36 <head>
37 <style>
38 #div1, #div2 {
39   float: left;
40   width: 100px;
41   height: 35px;
42   margin: 10px;
43   padding: 10px;
44   border: 1px solid black;
45 }
46 </style>
47 <script>
48 function allowDrop(ev) {
49   ev.preventDefault();
50 }
51 
52 function drag(ev) {
53   ev.dataTransfer.setData("text", ev.target.id);
54 }
55 
56 function drop(ev) {
57   ev.preventDefault();
58   var data = ev.dataTransfer.getData("text");
59   ev.target.appendChild(document.getElementById(data));
60 }
61 </script>
62 </head>
63 <body>
64 
65 <h2>Drag and Drop</h2>
66 <p>Drag the image back and forth between the two div elements.</p>
67 
68 <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
69   <img src="img_w3slogo.gif" draggable="true" ondragstart="drag(event)" id="drag1" width="88" height="31">
70 </div>
71 
72 <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
73 
74 </body>
75 </html>
76 */