Hjemmeside » Toolkit » Tilpassede tidsinngangsfelt med jQuery Timedropper

    Tilpassede tidsinngangsfelt med jQuery Timedropper

    Noen webformer krever datobaserte innganger og datoopptaker plugins kan hjelpe med det. Men hva med tidsinnganger?

    Med gratis jQuery-plugin Timedropper, du kan legge til tilpassede tidsplukkere for å angi avtaler, planlegge telefonsamtaler eller stort sett alt du trenger.

    Det er utrolig enkelt og deg trenger bare jQuery-biblioteket å komme i gang. Når du har installert det biblioteket, kan du legge til Timedropper JS / CSS-filene og la det løpe. Det er det!

    Hvert inntastingsfelt må være målrettet av en jQuery-velger som deretter legger til Timedropper-inputfeltet. Dette har muligheter Du kan legge til med ekstra (valgfri) funksjoner:

    • Automatisk bryter - Endrer automatisk time / minutt når du mousserer opp
    • meridianer - sett en 12-timers klokke i stedet for en 24-timers klokke
    • Format - angir hvordan timene og minuttene vises (standard stil er 1:22 pm)
    • Mus hjul - muliggjør tidsendring basert på hjulrulling
    • Init_animation - slår på fading animasjonseffekter
    • setCurrentTime - legger automatisk til gjeldende tid til feltverdien

    Hvis du er enda mer dristig kan du endre stilen bruke noen forhåndsdefinerte temaer, eller til og med bygge din egen fra bunnen av.

    I et hav av jQuery-plugins er Timedropper bien knær. Det virkelig tilbyr et unikt grensesnitt for noen app å velge en tid uansett enhet.

    Selvfølgelig er det responsivt, så det fungerer også på smarttelefoner og tabletter. Imidlertid liker jeg ikke mangel på num pad støtte. Det virker som den åpenbare måten å komme inn på en tid, så uten at den funksjonen kan det føles begrensende.

    Likevel, for en unikt grensesnitt og a enkelt oppsett, Jeg anbefaler Timedropper for alle som er villige til å gi det et skudd.

    Du kan finne all kildekoden gratis på GitHub, og du finner en utrolig enkel demo i denne pennen, innebygd nedenfor.

    Hvis du har noen andre tanker eller forslag, kan du dele med utvikleren på Twitter @felice_gattuso.