jQuery - Cuadro de diálogo de widgets

Descripción

los Widget DialogLa función se puede usar con widgets en JqueryUI. Los cuadros de diálogo son una de las formas agradables de presentar información en una página HTML. Un cuadro de diálogo es una ventana flotante con un título y un área de contenido. Esta ventana se puede mover, cambiar de tamaño y, por supuesto, cerrar con el icono "X" de forma predeterminada.

Sintaxis

Aquí está la sintaxis simple para usar Dialog:

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

Ejemplo

A continuación se muestra un ejemplo simple que muestra el uso de Dialog:

<!doctype html>
<html lang = "en">
   <head>
      <meta charset = "utf-8">
      <title>jQuery UI Dialog - Default functionality</title>
		
      <link rel = "stylesheet" 
         href = "//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
			
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
			
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js">
      </script>
  
      <script>
         $(function() {
            $( "#dialog" ).dialog();
         });
      </script>
   </head>
	
   <body>
      <div id = "dialog" title = "Basic dialog">
         <p>This is the default dialog which is useful for displaying
            information. The dialog window can be moved, resized and closed with
            the 'x' icon.</p>
      </div>
 
   </body>
</html>

Esto producirá el siguiente resultado:

jquery-widgets.htm

↰ Previous page