Mercurial Hosting > dad
comparison src/examples/drop.html @ 7:332d3e280f7e
minor
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Sun, 23 Apr 2023 20:46:17 -0600 |
parents | 1293cb0d30da |
children |
comparison
equal
deleted
inserted
replaced
6:4d699321068f | 7:332d3e280f7e |
---|---|
4 <meta name="viewport" content="width=device-width, initial-scale=1"> | 4 <meta name="viewport" content="width=device-width, initial-scale=1"> |
5 <style> | 5 <style> |
6 @import "/site.css"; | 6 @import "/site.css"; |
7 @import "/dad.css"; | 7 @import "/dad.css"; |
8 | 8 |
9 span[handle] { | 9 [handle] { |
10 display: inline-block; | 10 display: inline-block; |
11 background-color: LightGreen; | 11 background-color: LightGreen; |
12 padding: 8px; | 12 padding: 8px; |
13 } | 13 } |
14 span[outer] { | 14 [outer] { |
15 display: inline-block; | 15 display: inline-block; |
16 background-color: LightBlue; | 16 background-color: LightBlue; |
17 padding: 8px; | 17 padding: 8px; |
18 position: relative; | 18 position: relative; |
19 } | 19 } |
36 style.left = left + 'px'; | 36 style.left = left + 'px'; |
37 style.top = top + 'px'; | 37 style.top = top + 'px'; |
38 }; | 38 }; |
39 | 39 |
40 function init() { | 40 function init() { |
41 let span = document.querySelector('span[handle]'); | 41 let handle = document.querySelector('[handle]'); |
42 dad.setDraggable(span); | 42 dad.setDraggable(handle); |
43 } | 43 } |
44 </script> | 44 </script> |
45 </head> | 45 </head> |
46 <body> | 46 <body> |
47 <h1>Handle</h1> | 47 <h1>Handle</h1> |