jQuery Form Styler - плагин для стилизации селектов, чекбоксов, радиокнопок, файловых и числовых полей
Данный плагин позволяет стилизовать с помощью CSS следующие HTML-элементы: флажок <input type="checkbox">; переключатель <input type="radio">; поле для выбора файла <input type="file">. поле для ввода чисел <input type="number">. раскрывающийся список <select>; Демонстрация работы плагина Живые примеры можно посмотреть на отдельной странице. Стоит заметить, что при ...
Комментарии (2 614)
Выложил новую версию плагина. Изменения.
Отлично! Thumbs up!
Спасибо! Плагин очень нравится. Использую уже на нескольких проектах.
Какая лицензия у этого плагина?
Например, если я захочу использовать его как часть коммерческого продукта?
Лицензия MIT.
Благодарю
Если в хроме на маке начать переключать селект через клавиатуру, то появляется родной http://s2.ipicture.ru/uploads/20130127/XlhCrX2r.png
У меня нет возможности тестировать на маке.
Немного лень разбираться с кодом…и задам вопрос)
Надо привязать к выпадающему списку ID с префиксом.
Чтоб можно было осуществить перехват и сделать доп. подгрузку в другой select
Иль есть спец функция для этих целей?
ID назначьте оригинальному селекту и уже с ним и работайте.
Все действия, связанные с изменением содержимого, нужно производить с оригинальными элементами форм. Плагин предназначен только для изменения их внешнего вида.
нужна помощь, код
срабатывает только 2 раза, в чем причина
решил вопрос по другому
и тригер не понадобился…
Интересует как у вас работает border-radius в IE.
Сделал себе. Всё перепроверил, все стили перепроверил…а в IE не хочет закругляться
border-radius работает, начиная с 9-й версии IE.
Хочу при нажатие кнопки что бы произошел сбросить все input=radio (что бы ни один не был веделен)
$(‘input:radio’).removeAttr(“checked”).trigger(‘refresh’);
$(‘input:radio’).prop(‘checked’, false).trigger(‘refresh’);
Не происходит почемуто((, как исправить?
Это моя недоработка. В ближайшие дни выложу исправленную версию. Спасибо, что сообщили!
Исправляется следующим образом. Заменить:
на:
Добрый день!
В начале хотел бы поблагодарить автора за отличный плагин!
Подскажите пожалуйста, по такому вопросу.
У меня имеется структура:
Хочу, чтобы при выборе инпута, также подсвечивался и текст в лейбле другим цветом.
Т.е. по сути, при выборе инпута, лейблу тоже надо присвоить класс checked.
Что необходимо подправить в плагине?
P.S. Пытался решить вопрос с помощью css, но видимо не хватает знаний :( не вышло…
Спасибо.
Плагин менять не нужно. Достаточно написать дополнительный скрипт. Пример – http://jsbin.com/ujehef/1/edit
О! Спасибо! Заработало.
Только сбрасывается при перезагрузке страницы.
Тогда так – http://jsbin.com/ujehef/3/edit
А так срабатывает на все чекбоксы на странице, попробуйте добавить в пример еще пару чекбоксов, все будут подсвечены вне зависимости от значения checked
http://jsbin.com/ujehef/5/edit
Огромнейшее спасибо автору!
Все работает :) как надо.
Добрый день, начал пользоваться вашим плагином, но столкнулся с проблемой.
Мне нужно чтобы при клике на ссылку выбор в селекте менялся. Сделал так:
Но проблема в том что выбранный до этого пункт не сбрасывается, они выбираются оба. Собственно вопрос:
Как это дело можно реализовать?
Только что проверил – у меня это работает, как положено.
это не работает в Chrome, в остальных браузерах и правда работает
attr
замените наprop
, и в Хроме тоже будет работать.Привет.
Спасибо за скрипт. У меня вопрос по нему.
Я формирую пункты считывая их из xml. Потом вызываю styler() и получаю кукиш ))
В html есть, а списке .dropdown ul пусто, нет ни одного пункта.
Буду благодарен за помощь.
Ну я же не экстрасенс. Этой информации недостаточно.
Dimox, спасибо за быстрый ответ. Честно, не ожидал ))
http://jsfiddle.net/dr_killpatient/XYyG6/2/
Закомментировав 11 строку в js, можно увидеть, что пункты формируются.
Спасибо
Не в том месте запускаете плагин. 11-ю строку перенесите в конец функции parseXml.
bingo! спасибо за помощь
Есть проблема, на сайте к боди прописан direction:rtl; и не работает селект, т.е. кликаю и он открываются как в новым окне.. если снимаю direction:rtl; то то работает, можно как то исправить?
Не представляю, как это можно исправить.
а надо бы)) ладно.. поставлю другой плагин…
Спасибо за просто фантастический стилизатор! Мне очень понравился!
У меня есть вопрос к автору:
Как у Одиночного селекта с группировкой пунктов optgroup при выборе элемента, возвращать как выбранный элемент не только сам элемент списка, но и его группу.
Например при выборе Группа 2
2.1. Пункт 1
2.2. Пункт 2
2.3. Пункт 3
Как сделать так, чтобы в selected появилось например Группа 2 / 2.2. Пункт 2.
Я не смог найти доступ к Группе. Но понятно, что нужно добавить группу через вот эту строчку
Я пробывал селестор .closest(), но что-то не получилось:
Подскажите пожалуйста, должно быть просто!?
Спасибо!
Правильно будет так:
Ну конечно-же так!! :) Спасибо! Все отлично работает! ;)
В интернет эксплорере не показывается как в других. Как то можно пофиксить до идентичности?
А как задать размер обычного
?
Через
width
иheight
.С input получается, а вот с select – нет, остаётся того же фиксированного размера.
Только таким способом получилось, с разницой в 57px
Извиняюсь, еще .styler
Не понимаю, что вы пытаетесь сделать.
Мне нужно, что бы selectы были разного размера.
style=”width:500px” без form.styler работает. С form.styler этот select становится фиксированного размера, и не получается его изменить.
Извиняюсь, что отнимаю столько вашего внимания.
Видимо, вы что-то неправильно делаете. Должно работать.
Попробуйте сделать таким образом:
Полагаю, смысл понятен ;)
Так уже не нужно делать, все проще:
Либо:
Первый вариант более универсальный, естественно… Отлично!
Просто в моём варианте не нужно прописывать классы для каждого селекта (что удобнее, если все селекты в родителе должны быть одной ширины)… :)
В общем, всё гибко решается, за что Вам масса благодарностей – супер-плагин получился! :)
Да, это, конечно же, в зависимости от ситуации. Спасибо за отзыв!
Обновил jQ до v.1.9.1 и массовый выбор чекбоксов перестал работать…
До этого Вот Ваш пример отлично работал. Я так понял, какие-то изменения с тригером произвели, по ходу… В общем, после загрузки страницы по 1 разу выбираются/отменяются всех чекбоксы, потом только строки подсвечиваются…
Помогите починить, пожалуйста? :)
В скрипте поменяйте:
1)
attr('checked', true)
наprop('checked', true)
2)
removeAttr('checked')
наprop('checked', false)
Супер! Спасибо огромное, выручили)
Почитал несколько предыдущих страниц, и возник вопрос: Никто не пробовал сделать смену подсветки текста при переключении выбора одиночного выбора?
Это удобно при создании опросов, например… ;)
Привет. Спасибо за плагин. Но у меня траблы есть.
У меня список выглядит так:
oCity – это город. так вот на выходе с вашим плагином список пуст. Вот что вижу
СКРИНШОТ
Где поправить чтобы работало?
Мне эти данные не говорят ни о чем, что помогло бы решить проблему.
Подскажите пожалуйста подключил ваш плагин. Работает везде кроме ИЕ7-9. В чем может быть ошибка. Я сам jquery еще не понимаю.
Наугад сложно сказать.