Sokongan Polyfill Multirange untuk Slider Dual-Handle HTML5

The input HTML5 baru adalah hebat untuk kuantiti dan pilihan dinamik seperti tarikh. Tetapi slider lalai lalai tidak menyokong pelbagai pemegang.

Masukkan Multirange, a polyfill dicipta untuk menyokong pelbagai pemegang yang berfungsi dengan baik dan menyokong semua pelayar utama.

Ini adalah alat percuma dan ia menyediakan cara terbaik untuk tambah pelbagai pemegang secara asli, tanpa menggunakan plugin. Polyfill ini mempunyai dua sumber: a Fail JS dan a Fail CSS. Mereka kedua-duanya berfungsi pada input pelbagai dan anda boleh muat turun kedua-dua mereka dari repo GitHub utama.

Perhatikan ini bermakna anda perlu bekerja dengan penyemak imbas itu sudah menyokong input pelbagai secara lalai. Ia juga memerlukan pembolehubah CSS yang tidak disokong dalam semua pelayar.

Syukurlah, Multirange menggunakan sandaran CSS di mana dua slider jarak digunakan bukannya satu. Ini bukan penyelesaian yang sempurna tetapi masih menawarkan antara muka yang boleh digunakan. Di samping itu, ini berfungsi keluar dari kotak dengan tiada tali yang dilampirkan.

Hanya tambah fail ke laman web anda dan anda akan dapat menggunakan pelbagai atribut pada gelangsar anda. Anda juga boleh tetapkan julat untuk nilai input dengan koma.

Inilah a coretan ringkas HTML menggunakan slider Multirange:

Pemegang boleh menyeret antara satu sama lain dan juga kiri di atas satu sama lain. Dan input julat masih ada menyokong navigasi papan kekunci yang hebat untuk kemudahan.

Semua demo dan contoh kod sumber boleh didapati di halaman web Multirange, jadi periksa jika anda pernah mencari slider HTML pelbagai jarak.