SCRIPT Javascript 
Insertar minicalendario para entrada en formularios con Jquery.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>jQuery calendario</title>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>
//Aquí llamamos a los archivos javascript de Jquery y al archivo .css para darlo formato a nuestro calendario
<script type="text/javascript">
$(function(){
//Script para inicializar el calendario
$('#datepicker').datepicker({
inline: true
});
$('#dialog_link, ul#icons li').hover(
function() { $(this).addClass('ui-state-hover'); },
function() { $(this).removeClass('ui-state-hover'); }
);
});
</script>
<style type="text/css">
body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
.demoHeaders { margin-top: 2em; }
#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
ul#icons {margin: 0; padding: 0;}
ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;}
ul#icons span.ui-icon {float: left; margin: 0 4px;}
</style>
</head>
<body>
<script>
$(function() {
$( "#datepicker" ).datepicker({
changeMonth: true,
changeYear: true
});
});
</script>
<p>Date: <input type="text" id="datepicker"></p>
// Aquí tenemmos nuestra entrada de texto para el formulario con el calendario
</body>
</html>
AQUÍ OS DEJO UN ARCHIVO .RAR CON TODOS LOS ARCHIVOS NECESARIOS (DESCARGA)
Dudas o consultas, enviar correo a nuteco@nutecoweb.com . |
