Stylize html selects using jQuery
JavaScript Ruby
Switch branches/tags
Nothing to show
Pull request Compare This branch is 6 commits ahead, 37 commits behind Igor10k:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
Gemfile
Gemfile.lock
README.md
Rakefile
ikSelect.css
index.html
jquery.ikSelect.js
jquery.ikSelect.min.js
style.css

README.md

ikSelect

This plugin helps to stylize selects across all browsers with little effort. A demo is available.

Features

  • 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

Options

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.

API

$.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.