Anpassade tidsinmatningsfält med jQuery Timedropper
Vissa webbformulär kräver datumbaserade ingångar och datumväljare plugins kan hjälpa till med det. Men hur är det med tidsinmatningar?
Med det gratis jQuery-plugin Timedropper, du kan lägga till anpassade tidsplockare för inställning av möten, schemaläggning av telefonsamtal eller ganska mycket vad du behöver.
Det är otroligt enkelt och du behöver bara jQuery-biblioteket för att starta. När du har installerat det här biblioteket kan du lägga till Timedropper JS / CSS-filer och låta det springa. Det är allt!
Varje inmatningsfält måste vara inriktad av en jQuery-väljare som sedan lägger till inmatningsfältet Timedropper. Detta har alternativ du kan lägga till med extra (tillval) funktioner:
- Auto switch - Byter automatiskt timme / minut vid uppmätning
- meridianer - ställa in en 12-timmars klocka istället för en 24-timmarsperiod
- Formatera - anger hur timmarna och minuter visas (standard stil är 1:22 pm)
- mushjulet - möjliggör tidsändring baserat på hjulrullning
- Init_animation - aktiverar de blekna animationseffekterna
- setCurrentTime - lägger automatiskt till aktuell tid till fältvärdet
Om du är ännu mer vågad kan du ändra stilen Använda några förpackade teman, eller ens bygga din egen från början.
I ett hav av jQuery-plugins är Timedropper biet knä. Det verkligen erbjuder ett unikt gränssnitt för varje app att välja en tid oavsett enhet.
Det är naturligtvis det mobil-känslig, så det fungerar också på smartphones och surfplattor. Jag gillar dock inte brist på num pad support. Det verkar som det självklara sättet att komma in en tid, så utan att det kan känna sig begränsande.
Fortfarande för en unikt gränssnitt och a enkel installation, Jag rekommenderar Timedropper för alla som vill ge det ett skott.
Du kan hitta all källkod gratis på GitHub och du hittar en otroligt enkel demo i den här pennan, inbäddad nedan.
Om du har några andra tankar eller förslag kan du dela med utvecklaren på Twitter @felice_gattuso.
