Los famosos JDialog ó Modal logran dar más formalidad y dinamismo a tus páginas en especial si deseas llamar a un formulario de logueo, registro, quizá un detalle cómo ofertas y anuncios. He visto sitios web de los más inimaginables y siempre han logrado llamar mi atención con sus diseños de estos componentes, muy bien aplicados y sobre todo funcionales.
Aquí un claro ejemplo del componente JDialog:
Para poder lograr mostrar este div flotante podemos hacerlo de la siguiente manera:
En la función de carga, debemos agregar lo siguiente:
$(function() {
$("#CapaEjemplo").dialog({
autoOpen: false,
modal: true,
cache: false,
title: "Generar Registro",
height:635,
width: 980
});
});
Para poder mostrar esto lo único que hacemos es cambiar true en el atributo autoOpen, y se mostrará apenas cargue su página de lo contrario en algún evento de otro componente pueden agregar lo siguiente:
$("#CapaEjemplo").dialog("open")
Pero además se debe crear la etiqueta de la capa, el HTML
<div id="CapaEjemplo" style="display:none;"></div>
Con esto será más que suficiente y podrá lograr efectos superiores según los estilos que diseñe.