root/ui/web/htdocs/js/jquery-ui-1.7.2/demos/droppable/revert.html

Revision 21720f443fc4436e839bfadf21de9c6fd47366e0, 1.7 kB (checked in by Umar Farooq <umar@omniti.com>, 9 years ago)

upgrading jquery to 1.3.2, and jquery-ui to 1.7.2.
adding slider to allow toggling of polltimerefs #147

  • Property mode set to 100644
Line 
1 <!doctype html>
2 <html lang="en">
3 <head>
4         <title>jQuery UI Droppable - Revert draggable position</title>
5         <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
6         <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
7         <script type="text/javascript" src="../../ui/ui.core.js"></script>
8         <script type="text/javascript" src="../../ui/ui.draggable.js"></script>
9         <script type="text/javascript" src="../../ui/ui.droppable.js"></script>
10         <link type="text/css" href="../demos.css" rel="stylesheet" />
11         <style type="text/css">
12         #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
13         #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
14         </style>
15         <script type="text/javascript">
16         $(function() {
17
18                 $("#draggable").draggable({ revert: 'valid' });
19                 $("#draggable2").draggable({ revert: 'invalid' });
20
21                 $("#droppable").droppable({
22                         activeClass: 'ui-state-hover',
23                         hoverClass: 'ui-state-active',
24                         drop: function(event, ui) {
25                                 $(this).addClass('ui-state-highlight').find('p').html('Dropped!');
26                         }
27                 });
28
29         });
30         </script>
31 </head>
32 <body>
33 <div class="demo">
34        
35 <div id="draggable" class="ui-widget-content">
36         <p>I revert when I'm dropped</p>
37 </div>
38
39 <div id="draggable2" class="ui-widget-content">
40         <p>I revert when I'm not dropped</p>
41 </div>
42
43 <div id="droppable" class="ui-widget-header">
44         <p>Drop me here</p>
45 </div>
46
47 </div><!-- End demo -->
48
49 <div class="demo-description">
50
51 <p>Return the draggable (or it's helper) to its original location when dragging stops with the boolean <code>revert</code> option set on the draggable.</p>
52
53 </div><!-- End demo-description -->
54 </body>
55 </html>
Note: See TracBrowser for help on using the browser.