| 1 | <html> |
|---|
| 2 | <head> |
|---|
| 3 | <script type="text/javascript" src="jquery.pack.js">/* jQuery core */</script> |
|---|
| 4 | <script type="text/javascript" src="interface.js">/* jQuery Interface plugin */</script> |
|---|
| 5 | <script type='text/javascript'> |
|---|
| 6 | |
|---|
| 7 | $(document).ready(function(){ |
|---|
| 8 | var elem = document.createElement('div'); |
|---|
| 9 | elem = $(elem); |
|---|
| 10 | elem.css('width', '50px'); |
|---|
| 11 | elem.css('height', '50px'); |
|---|
| 12 | elem.text("Drag me"); |
|---|
| 13 | elem.css('border', '1px dotted #000'); |
|---|
| 14 | $('#DivBottom').append(elem); |
|---|
| 15 | elem.Draggable({containment:'parent'}); |
|---|
| 16 | }); |
|---|
| 17 | </script> |
|---|
| 18 | </head> |
|---|
| 19 | <body> |
|---|
| 20 | |
|---|
| 21 | <div id='DivTop' style='border:1px solid #000;background-color:#ffeeee'> |
|---|
| 22 | This div is here<br/> |
|---|
| 23 | to shift the real |
|---|
| 24 | <br/>parent div away<br/> |
|---|
| 25 | from 0/0. |
|---|
| 26 | </div> |
|---|
| 27 | |
|---|
| 28 | <div id='DivBottom' style='width:200px;border:1px solid #000;background-color:#e0e0e0'> |
|---|
| 29 | Try dragging<br/> |
|---|
| 30 | with<br/> |
|---|
| 31 | this<br/> |
|---|
| 32 | area |
|---|
| 33 | |
|---|
| 34 | </body></html> |
|---|
