Selector de fecha básico para el campo de entrada-DatePicker. js
| Autor: | ZPavel |
|---|---|
| Views Total: | 2,494 |
| Sitio oficial: | Ir a la web |
| Actualizado: | November 18, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Esta es una librería JavaScript súper simple que anexa un selector de fecha mínimo y limpio al campo de entrada usando JavaScript puro sin dependencias.
Funcionamiento
Cree una entrada de texto normal para el selector de fecha.
<input type="text" class="datepicker"/>
Coloque el archivo JavaScript ' DatePicker. js ' en la parte inferior de la Página Web.
<script src="datepicker.js"></script>
Eso es todo. Aplique los estilos CSS personalizados al selector de fecha.
.dropdown {
position: absolute;
line-height: 20px;
font-size: 12px;
width: 140px;
display: none;
background: #f6f6f6;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
a.previous, a.next, .days a {
cursor: pointer;
text-align: center;
display: inline-block;
width: 20px;
}
.selected {
font-weight: bold;
background: #8a46ff;
color: #ffffff;
}
input.datepicker:focus + div.dropdown { display: block; }
input.datepicker:focus + div.dropdown, div.dropdown:hover { display: block; } Registro de cambios
11/18/2018
- fija para IE 11
10/21/2018
- mes init fijo con 2 dígitos
