|
Revision 1, 1.4 kB
(checked in by falcon, 17 years ago)
|
|
Version one -> initial work from the laptop.
|
| Line | |
|---|
| 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
|---|
| 2 | <html> |
|---|
| 3 | <head> |
|---|
| 4 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| 5 | <title></title> |
|---|
| 6 | <script src="../../lib/prototype.js" type="text/javascript"></script> |
|---|
| 7 | <script src="../../src/scriptaculous.js" type="text/javascript"></script> |
|---|
| 8 | </head> |
|---|
| 9 | <body> |
|---|
| 10 | <div id="source" style="height: 100px; width: 100px; background-color: gray;"> |
|---|
| 11 | Draggable |
|---|
| 12 | </div> |
|---|
| 13 | <script type="text/javascript"> |
|---|
| 14 | //<![CDATA[ |
|---|
| 15 | new Draggable("source", { |
|---|
| 16 | revert:"failure", |
|---|
| 17 | onDropped: function(element){ $(element).update('I WAS DROPPED!') }, |
|---|
| 18 | reverteffect: function(element, top_offset, left_offset) { |
|---|
| 19 | var dur = Math.sqrt(Math.abs(top_offset^2)+Math.abs(left_offset^2))*0.02; |
|---|
| 20 | new Effect.Move(element, { |
|---|
| 21 | x: -left_offset, y: -top_offset, duration: dur, |
|---|
| 22 | transition: Effect.Transitions.spring, |
|---|
| 23 | queue: {scope:'_draggable', position:'end'} |
|---|
| 24 | }); |
|---|
| 25 | } |
|---|
| 26 | }); |
|---|
| 27 | //]]> |
|---|
| 28 | </script> |
|---|
| 29 | |
|---|
| 30 | <br/> |
|---|
| 31 | |
|---|
| 32 | <div id="target" style="height: 100px; width: 100px; background-color: green;"> |
|---|
| 33 | Good Target |
|---|
| 34 | </div> |
|---|
| 35 | |
|---|
| 36 | <script type="text/javascript"> |
|---|
| 37 | //<![CDATA[ |
|---|
| 38 | Droppables.add("target", { |
|---|
| 39 | onDrop:function(element){ Effect.Puff($('source')); } |
|---|
| 40 | }); |
|---|
| 41 | //]]> |
|---|
| 42 | </script> |
|---|
| 43 | |
|---|
| 44 | <br/> |
|---|
| 45 | |
|---|
| 46 | </body> |
|---|
| 47 | </html> |
|---|