El widget Dialog de jQuery UI
El widget dialog() es bastante sencillo, pero poderooosooooo. Nos permitirá hacer ventanas de mensaje, sin que sean consideradas ventanas de diálogo o pop-ups. Con sus diferentes parámetros podemos dar opciones de confirmación y cancelación, asi como mostrar diferentes íconos. También podemos darle efectos de entrada y de salida.<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link href="css/ui-lightness/jquery-ui-1.10.1.custom.min.css" rel="stylesheet"/>
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery-ui-custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(inicio);
function inicio(){
//$("#mensaje").dialog( {show: {effect: "blind",duration: 1000},hide: {effect: "explode",duration: 1000}});
/*$("#mensaje").dialog( {modal: true,
height:280,
width:500,
buttons:{Continue: function() {
$( this ).dialog( "close" );
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
}); */
$("#mensaje").dialog( {modal: true,
height:280,
width:500,
buttons:{Ok: function() {
$( this ).dialog( "close" );
}
}
});
}
</script>
<title>Base de UI</title>
<style>
.centra{
font-weight:bold;
text-align:center;
}
</style>
</head>
<body>
<div id="mensaje" title="Advertencia">
<p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 50px 0;"></span>La siguiente página contiene material real y explicito,
que podría afectar la sensibilidad
del espectador.</p><p class="centra">Se recomienda discreción.</p>
</div>
</body>
</html>
No hay comentarios:
Publicar un comentario