Ako skryť ovládacie šípky pre výber čísla v textboxe (CSS)
V tomto článku predstavím, ako sa dajú skryť ovládacie šípky pre výber čísla v textboxe (spin buttons). Skôr ako sa pustím do riešenia, chcem podotknúť, že HTML5 number spinner je v súčasnosti podporovaný len prehliadačom Google Chrome (predpokladám, že aj Opera a Safari). Internet Explorer a Firefox umožňujú vpisovať aj písmená. Firefox a Google Chrome navyše zobrazujú ovládacie prvky na zmenu hodnoty (spin buttons).A práve tieto ovládacie prvky často kazia dizajn a je potrebné ich skryť. Pre skrytie ovládacích prvkov pre HTML5 number spinner slúži nasledujúci zápis.Príklad: Zápis do elementu <style>.
1
2
3
4
5
6
7
input[type="number"]{
-moz-appearance: textfield;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
}
Otestovať správnosť zápisu je možné na nasledujúcom príklade.Príklad: Zápis do elementu <body>.
1
<input type="number" min="1" required>
Záver
Do pozornosti tiež dávam článok Ako zistiť či hodnota v textboxe je číslo (JavaScript)17.12.2016, Matej LednárKategória: CSSCSS,number spinner,textbox,<input>,required,min,spinnerŽiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.Viac informácií nájdete v sekcii O projekte.