[ Index ]

PHP Cross Reference of Drupal 6 (yi-drupal)

title

Body

[close]

/sites/all/libraries/jquery.ui/demos/droppable/ -> default.html (source)

   1  <!doctype html>
   2  <html lang="en">
   3  <head>
   4      <title>jQuery UI Droppable - Default Demo</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 { 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          $("#draggable").draggable();
  18          $("#droppable").droppable({
  19              drop: function(event, ui) {
  20                  $(this).addClass('ui-state-highlight').find('p').html('Dropped!');
  21              }
  22          });
  23  
  24      });
  25      </script>
  26  </head>
  27  <body>
  28  <div class="demo">
  29      
  30  <div id="draggable" class="ui-widget-content">
  31      <p>Drag me to my target</p>
  32  </div>
  33  
  34  <div id="droppable" class="ui-widget-header">
  35      <p>Drop here</p>
  36  </div>
  37  
  38  </div><!-- End demo -->
  39  
  40  <div class="demo-description">
  41  
  42  <p>Enable any DOM element to be droppable, a target for draggable elements.</p>
  43  
  44  </div><!-- End demo-description -->
  45  </body>
  46  </html>


Generated: Mon Jul 9 18:01:44 2012 Cross-referenced by PHPXref 0.7