Pseudo-inputs
This style mimics text inputs, so mixed elements can be included:
Check
USA
This is an information bubble to help the user.
Special inputs
Select files
Selects
Custom skin select:
Selected value
Open on hover
These custom select come with advanced features:
- Two opening modes: click and hover
- Preserve original select width if set
- Screen position auto-detect: the list open on top if there is not enough space below the select - even while scrolling!
- Support for multiple selects, with easy-selection mode (enabled automatically on touch devices)
- Display as drop-down or as list
- Keyboard focus, scroll and select
- Keyboard search: type one or more letters to jump to the first matching entry
- Configuration options are set with classes and inline data attribute - no javascript needed
- On touch screens, fallback to OS interface when selecting
Selects examples
Expandable list
For long values
Expand
Disabled
By class or input
Disabled
Check list
Touch friendly
Check list
Multiple selection
(hold Ctrl/Cmd)
Multiple
Multiple + check
Easy selection
Multiple
Multiple + allow empty
Easy selection
Multiple
Single as list
(no multiple selection)
First valueSecond valueMultipleDisabled value
Multiple as list
(hold Ctrl/Cmd)
First valueSecond valueMultipleDisabled value
Multiple + check
Easy selection
First valueSecond valueMultipleDisabled value
In a tooltip
Context menu
First valueSecond valueContext menuDisabled value