| [ Index ] |
PHP Cross Reference of Drupal 6 (gatewave) |
[Summary view] [Print] [Text view]
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <title>jQuery UI Draggable + Sortable</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.sortable.js"></script> 10 <link type="text/css" href="../demos.css" rel="stylesheet" /> 11 <style type="text/css"> 12 .demo ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; } 13 .demo li { margin: 5px; padding: 5px; width: 150px; } 14 </style> 15 <script type="text/javascript"> 16 $(function() { 17 $("#sortable").sortable({ 18 revert: true 19 }); 20 $("#draggable").draggable({ 21 connectToSortable: '#sortable', 22 helper: 'clone', 23 revert: 'invalid' 24 }) 25 $("ul, li").disableSelection(); 26 }); 27 </script> 28 </head> 29 <body> 30 <div class="demo"> 31 32 <ul> 33 <li id="draggable" class="ui-state-highlight">Drag me down</li> 34 </ul> 35 36 <ul id="sortable"> 37 <li class="ui-state-default">Item 1</li> 38 <li class="ui-state-default">Item 2</li> 39 <li class="ui-state-default">Item 3</li> 40 <li class="ui-state-default">Item 4</li> 41 <li class="ui-state-default">Item 5</li> 42 </ul> 43 44 </div><!-- End demo --> 45 46 <div class="demo-description"> 47 48 <p> 49 Draggables are built to interact seamlessly with <a href="#">sortables</a>. 50 </p> 51 52 </div><!-- End demo-description --> 53 </body> 54 </html>
title
Description
Body
title
Description
Body
title
Description
Body
title
Body
| Generated: Thu Mar 24 11:18:33 2011 | Cross-referenced by PHPXref 0.7 |