jClever - smart jNice with buns. Styling HTML Forms

The author of the article and the plugin is DenisZ habraiser

jClever Forms is a plugin for styling HTML forms that provides its own API.

Experience with such stylists forms, as jNice , jqTransform , Uniform forced to write a bicycle. The current version almost completely repeats jNice capabilities and even complements them.
')

Plugin features:

• styling of select form elements (drop-down list) including scroll bar
• stylization of form elements like checkbox (flags)
• stylization of form elements such as radio button (switches)
• form reset (reset method)
• disable plugin (destroy method)
• working with the collection of form elements (selectCollection)
• direct drop-down list management (selectSetPosition method)
• direct checkbox control (checkboxSetState method)
• direct control radio button (radioSetState method)

The current implementation of the plug-in deliberately does not include the processing of text fields (input type text) and multi-line text fields (textarea). Their processing and stylization, as a rule, does not cause difficulties. Perhaps in future versions of the plugin, this approach will be revised.

The simplest initialization, you just need to add a class, for example, jClever to the form:

<form action="#" method="get" class="jClever">

and initialize the plugin on the selector:

jQuery('.jClever').jClever();

Plugin page: http://tools.alterego-russia.ru/jclever

The demo can be seen here: http://tools.alterego-russia.ru/jclever/example/index.html

Project on githab: https://github.com/denis-zavgorodny/jClever

Documentation: http://tools.alterego-russia.ru/jclever/#docs

UPD:

• when moving through form elements added active element selection
• Fixed behavior of selects (opening, closing), moving through selectors from the keyboard [up / down], processing Enter, Tab and Space. Automatic scrolling after moving around (thanks to merkuriy for comments)