Multirange Polyfill-tuki kaksikäden HTML5-liukusäätimille

uudet HTML5-alueen tulot ovat fantastisia määriä ja dynaamisia valintoja kuten päivämääriä. Mutta oletusalueen liukusäädin ei tue useita kädensijoja.

Tulla sisään Multirange, Polyfill luotu tukemaan useita kahva jotka toimivat oikein ja tukevat kaikkia tärkeimpiä selaimia.

Tämä on ilmainen työkalu ja se tarjoaa parhaan tavan lisää useita kädensijoja, ilman pluginia. Tämä polyfillillä on kaksi resursseja: a JS-tiedosto ja a CSS-tiedosto. Ne molemmat työskentelevät kantotuloissa ja sinä voit lataa molemmat GitHubin tärkeimmästä reposta.

Huomaa, että tämä tarkoittaa sitä, että sinun täytyy työskennellä selaimissa tukevat jo aluetuloa oletuksena. Se myös vaatii CSS-muuttujia joita ei tueta kaikissa selaimissa.

Onneksi Multirange käyttää CSS-varausta jossa käytetään kahden alueen liukusäädintä yhden sijasta. Tämä ei ole täydellinen ratkaisu, mutta se tarjoaa silti käyttökelpoisen käyttöliittymän. Plus-puolella tämä toimii suoraan laatikosta ilman ehtoja.

Vain lisää tiedostot sivustoosi ja voit Käytä moninkertainen ominaisuus liukusäätimillä. Voit myös asettaa arvot syöttöarvoille pilkulla.

Tässä on a lyhyt HTML-pätkä käyttämällä Multirange-liukusäädintä:

Kahvat voivat olla vetää ohi toisistaan ja jopa vasemmalle toistensa päälle. Ja vaihteluväli syöttää vielä tukee näppäimistön navigointia joka on hyvä saavutettavuuden kannalta.

Kaikki demoja ja lähdekoodit löytyy Multirange-verkkosivulta, joten tarkista se, jos etsit koskaan a HTML-liukusäädin.