jClever — умный jNice с плюшками. Стилизация HTML-форм

в 13:14, , рубрики: javascript, jquery, web-разработка, Веб-разработка, плагин, стилизация, стилизация радио и чекбоксов, формы, метки: , , , , , ,

jClever — умный jNice с плюшками. Стилизация HTML форм
Автор статьи и плагина  — читатель DenisZ

jClever Forms — это плагин для стилизации HTML форм, который предоставляет свой API.

Опыт работы с такими стилизаторами форм, как jNice, jqTransform, Uniform заставил написать велосипед. Текущая версия практически полностью повторяет возможности jNice и даже дополняет их.


Возможности плагина:

  • стилизация элементов форм типа select (выпадающий список) включая полосу прокрутки
  • стилизация элементов форм типа checkbox (флажки)
  • стилизация элементов форм типа radio button (переключатели)
  • сброс формы (reset метод)
  • отключение плагина (destroy метод)
  • работа с коллекцией элементов формы (selectCollection)
  • прямое управление выпадающими списками (selectSetPosition метод)
  • прямое управление checkbox (checkboxSetState метод)
  • прямое управление radio button (radioSetState метод)

В текущую реализацию плагина сознательно не включены обработка текстовых полей (input type text) и многострочных текстовых полей (textarea). Их обработка и стилизация, как правило, не вызывает затруднений. Возможно, в следующих версиях плагина этот подход будет пересмотрен.

Инициализация простейшая, всего лишь необходимо добавить класс jClever к форме:

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

Страница плагина: http://tools.alterego-russia.ru/jclever/#docs

Демо можно увидеть здесь: http://tools.alterego-russia.ru/jclever/example/index.html

Проект на гитхаб: https://github.com/denis-zavgorodny/jClever

Документация: http://tools.alterego-russia.ru/jclever/#docs

Автор: NightWriter


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js