jQuery: The Write Less, Do More JavaScript Library

UI/Dialog

From jQuery JavaScript Library

Jump to: navigation, search

« Back to the jQuery UI Docs

NameType
Dependencies:

  • ui.base.js
  • Optional, ui.draggable.js
  • Optional, ui.resizable.js

NameType


NameType
Plugin methods:



NameType
dialog( options ) Returns: jQuery
Make the selected elements Dialog boxes.
dialog( "open" ) Returns: jQuery
Opens the specified dialog boxes.
dialog( "close" ) Returns: jQuery
Closes the specified dialog boxes.
dialog( "destroy" ) Returns: jQuery
Completely remove the dialog.

NameType
Example:
A simple jQuery UI Dialog.

$("#example").dialog();

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    $("#example").dialog();
  });
  </script>
  
</head>
<body>
  <link rel="stylesheet" href="http://dev.jquery.com/view/trunk/themes/flora/flora.all.css" type="text/css" media="screen" title="Flora (Default)">
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.base.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.dialog.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.resizable.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.draggable.js"></script>


<div id="example" class="flora" title="This is my title">I'm in a dialog!</div>
</body>
</html>

NameType


Demos

Theming