Agregando el script
<script type="text/javascript" src="./Scripts/datepicker.js">alert ("Error en la carga del calendario datapicker.js");</script>Agregando los estilos del calendario
<link href="./hojas_css/demo.css" rel="stylesheet" type="text/css" /> <link href="./hojas_css/datepicker.css" rel="stylesheet" type="text/css" />
Una vez cargados estos archivos (como siempre generalmente el codigo anterior va en la cabecera, por nada personal si no como una buena practica de programacion) lo unico que hay que hacer es agregar una clase css a nuestro elemento en cuestion (regularmente un textbox) con los parametros del tipo de calendario que deseamos generar.
<input name="fecha" type="text" class="format-y-m-d highlight-days-67 range-low-today" id="f_limite" size="10"/>
Bueno esto es solo un ejemplo de lo rapido que pueden integrar este calendario a sus paginas web, para mas informacion presionen aqui iran directamente a la pagina oficial y ahi encontraran tutoriales, descargas y muchos ejemplos.
Para ver mas ejemplos de este calendario presiona aqui
Para Descargar el script presiona aqui
nota de desarrollo: Al momento de integrar el calendario data piker a nuestra pagina, si ponemos el css demo observaremos que obviamente nos altera nuestro propio css y si lo quitamos, el calendario sale demasiado grande, lo que hace limitar el tamaño del calendario, es el tamaño de la letra declarado en body de la css demo, por lo consiguiente si unicamente ponemos font-size:12px; en el body de nuestro css, el calendario tomara un tamaño pequeño sin tener que agregar el estilo demo.css que nos afectaria a nuestro propio estilo. :)
No hay comentarios:
Publicar un comentario