[ Index ]

PHP Cross Reference of Drupal 6 (yi-drupal)

title

Body

[close]

/sites/all/libraries/jquery.ui/demos/dialog/ -> modal-message.html (source)

   1  <!doctype html>
   2  <html lang="en">
   3  <head>
   4      <title>jQuery UI Dialog - Modal message</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.resizable.js"></script>
  10      <script type="text/javascript" src="../../ui/ui.dialog.js"></script>
  11      <script type="text/javascript" src="../../external/bgiframe/jquery.bgiframe.js"></script>
  12      <link type="text/css" href="../demos.css" rel="stylesheet" />
  13      <script type="text/javascript">
  14      $(function() {
  15          $("#dialog").dialog({
  16              bgiframe: true,
  17              modal: true,
  18              buttons: {
  19                  Ok: function() {
  20                      $(this).dialog('close');
  21                  }
  22              }
  23          });
  24      });
  25      </script>
  26  </head>
  27  <body>
  28  
  29  <div class="demo">
  30  
  31  <div id="dialog" title="Download complete">
  32      <p>
  33          <span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
  34          Your files have downloaded successfully into the My Downloads folder.
  35      </p>
  36      <p>
  37          Currently using <b>36% of your storage space</b>.
  38      </p>
  39  </div>
  40  
  41  <!-- Sample page content to illustrate the layering of the dialog -->
  42  <div class="hiddenInViewSource" style="padding:20px;">
  43      <p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
  44      <form>
  45          <input value="text input" /><br />
  46          <input type="checkbox" />checkbox<br />
  47          <input type="radio" />radio<br />
  48          <select>
  49              <option>select</option>
  50          </select><br /><br />
  51          <textarea>textarea</textarea><br />
  52      </form>
  53  </div><!-- End sample page content -->
  54  
  55  </div><!-- End demo -->
  56  
  57  <div class="demo-description">
  58  
  59  <p>Use a modal dialog to explicitly acknowledge information or an action before continuing their work.  Set the <code>modal</code> option to true, and specify a primary action (Ok) with the <code>buttons</code> option.</p>
  60  
  61  </div><!-- End demo-description -->
  62  
  63  </body>
  64  </html>


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