root/public/javascripts/scriptaculous/test/functional/dragdrop9_test.html @ 11

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>
Note: See TracBrowser for help on using the browser.