| 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" |
| 2 | "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| 3 | <html xmlns="http://www.w3.org/1999/xhtml"> |
| 4 | <head> |
| 5 | <title>Signal Example</title> |
| 6 | <link href="draggable.css" rel="stylesheet" type="text/css" /> |
| 7 | <script type="text/javascript" src="../../MochiKit/MochiKit.js"></script> |
| 8 | <script type="text/javascript" src="draggable.js"></script> |
| 9 | </head> |
| 10 | <body> |
| 11 | |
| 12 | <h1> |
| 13 | Dragging with MochiKit |
| 14 | </h1> |
| 15 | <p> |
| 16 | This is an example of one might implement a drag handler with |
| 17 | MochiKit’s Signal. |
| 18 | </p> |
| 19 | <p> |
| 20 | For a detailed description of what happens under the hood, check out |
| 21 | <a href="draggable.js" class="view-source">draggable.js</a>. |
| 22 | </p> |
| 23 | <p> |
| 24 | View Source: [ |
| 25 | <a href="index.html" class="view-source">index.html</a> | |
| 26 | <a href="draggable.js" class="view-source">draggable.js</a> | |
| 27 | <a href="draggable.css" class="view-source">draggable.css</a> |
| 28 | ] |
| 29 | </p> |
| 30 | |
| 31 | |
| 32 | <div class="draggable red" style="left: 10px;">R</div> |
| 33 | <div class="draggable green" style="left: 120px;">G</div> |
| 34 | <div class="draggable blue" style="left: 230px;">B</div> |
| 35 | <div class="draggable white" style="left: 340px;">W</div> |
| 36 | |
| 37 | </body> |
| 38 | </html> |