Πολλαπλή υποστήριξη Polyfill για ρυθμιστικά HTML5 διπλής χειρολαβής

ο νέες εισόδους γκάμας HTML5 είναι φανταστικά για ποσότητες και δυναμικές επιλογές όπως ημερομηνίες. Αλλά ο ρυθμιστής προκαθορισμένης εμβέλειας δεν υποστηρίζει πολλαπλές λαβές.

Εισαγω Πολύγλωσσο, ένα polyfill δημιουργήθηκε για να υποστηρίξει πολλαπλές λαβές που λειτουργούν σωστά και υποστηρίζουν όλα τα μεγάλα προγράμματα περιήγησης.

Αυτό είναι ένα δωρεάν εργαλείο και παρέχει τον καλύτερο τρόπο προσθέστε πολλαπλές λαβές εγγενώς, χωρίς τη χρήση plugin. Αυτό το polyfill έχει δύο πόρους: ένα JS αρχείο και ένα CSS. Αυτοί και οι δύο λειτουργούν σε εισόδους εμβέλειας και μπορείς κατεβάστε και τα δύο από το κύριο GitHub repo.

Σημειώστε αυτό σημαίνει ότι πρέπει να εργάζεστε με προγράμματα περιήγησης που ήδη υποστηρίζουν την είσοδο εύρους από προεπιλογή. Επίσης απαιτεί μεταβλητές CSS που δεν υποστηρίζονται σε όλα τα προγράμματα περιήγησης.

Ευτυχώς, Multirange χρησιμοποιεί μια εναλλακτική λύση CSS όπου χρησιμοποιούνται δύο ρυθμιστικά εύρους αντί για ένα. Αυτό δεν είναι μια τέλεια λύση, αλλά εξακολουθεί να προσφέρει μια χρήσιμη διασύνδεση. Από την πλευρά συν, αυτό λειτουργεί σωστά από το κουτί χωρίς συστοιχίες συνδεδεμένες.

Μόλις προσθέστε τα αρχεία στον ιστότοπό σας και θα είστε σε θέση να Χρησιμοποιήστε το πολλαπλούς Χαρακτηριστικό στα πεδία ολισθητήρων. Μπορείτε επίσης να ρυθμίστε εύρη τιμών εισόδου με κόμμα.

Εδώ είναι α σύντομο απόσπασμα HTML χρησιμοποιώντας το ρυθμιστικό Multirange:

Οι λαβές μπορούν να είναι ρυμουλκούμενα το ένα μετά το άλλο και ακόμα αριστερά το ένα πάνω στο άλλο. Και η είσοδος εύρους ακόμα υποστηρίζει πλοήγηση πληκτρολογίου η οποία είναι μεγάλη για την προσβασιμότητα.

Ολα τα demos και δείγματα πηγαίου κώδικα μπορεί να βρεθεί στην ιστοσελίδα Multirange, οπότε ελέγξτε το αν ψάχνετε ποτέ ένα πολλαπλού εύρους HTML.