Merida Design Blog

Publicado el | Recursos / ,

DateDropper: Sencillos y atractivos selectores de fechas para tu aplicación

DateDropper es un plugin de jQuery que te permite agregar atractivos selectores de fecha en los campos de texto configurando el formato e idioma en el que muestra la fecha seleccionada dentro del campo.

Al momento de escribir este artículo, DateDropper cuenta con soporte para 16 idiomas.


Modo de uso

1. Agrega los archivos en la etiqueta head de tu html.


    <script src="js/datedropper.js"></script>
    <link rel="stylesheet" type="text/css" href="js/datedropper.css">

2. Define un identificador para el campo.


    <input type="text" id="fechaInicio" />

3. Configura el DateDropper


    <script>
        $('#fechaInicio').dateDropper({
            format: 'y-m-d', // Formato de la fecha 2016-16-01
            lang: 'es',
            placeholder: 'Haz click aquí',
            minYear: '2016',
            animation: 'bounce' // La opciones son: fadeIn, dropdown y bounce
        });
    </script>

También puedes revisar el código del siguiente demo.

See the Pen Date Dropper Plugin Example by Iván Villamil (@ivillamil) on CodePen.15465

Página: http://felicegattuso.com/projects/datedropper



Publicaciones que pueden interesarte

    Deja un comentario

      tope
    Derechos Reservados, Merida Design 2017
    %d bloggers like this: