This plugin helps to stylize selects across all browsers with little effort. A demo is available.
- full customization!
- use of custom syntax
- works perfect as an inline-block
- behavior is as close as possible to the original selects in every browser
- no z-index bugs in IE
- automatic calculations
- dropdown position, so it's always visible when opened
- width for the select or it's dropdown (can be disabled)
- active options appears in the center of the dropdown when it's opened
- keyboard support
- search by letters/numbers/etc
- navigation using arrows, space, enter, pgup/pgdown, home/end, esc
- tab
- add/remove options using API or make changes to the original select and then just reset the fake one
- support for disabling
- optgroups support
- compatible with mobile devices
- fast
- easy to use
- built with attention to details
- no animals were harmed in the making
syntax: '<div class="ik_select_link"><span class="ik_select_link_text"></span></div><div class="ik_select_block"><div class="ik_select_list"></div></div>'
Passing custom syntax to create fake select. The only condition is that "ik_select_link_text" should be inside "ik_select_link" and "ik_select_list" should be inside "ik_select_block". Other than that any syntax can be passed to plugin.
autowidth: true(/false)
Set width of the select according to the longest option.
ddFullWidth: true(/false)
Set width of the dropdown according to the longest option.
customClass: ""
Add custom class to the fake select's wrapper.
ddMaxHeight: 200
Maximum allowed height for dropdown.
$.ikSelect("set_defaults", <settings>)
Override defaults for new instances.
$(selector).ikSelect("add_options", <optionsObject>)
Add options by providing option values and strings. Specify optgroup index if needed.
$(selector).ikSelect("remove_options", <optionsArray>)
Remove options using array of values.
$(selector).ikSelect("select", <optionValue>)
Change selected option by value.
$(selector).ikSelect("show_dropdown")
Show dropdown assosiated with the passed select.
On Android this method shows the fake dropdown, not the native one!
$(selector).ikSelect("enable")
Enable select.
$(selector).ikSelect("disable")
Disable select.
$(selector).ikSelect("toggle")
Disables enabled and enables disabled select.
author: i10k.ru
Webmoney: Z334495514328, E409956596538, R182643156363
Yandex.Money: 410011319936560
Thanks for your support.