Комментарии 74
А я бы еще порекомендовал эту библиотеку harvesthq.github.com/chosen/, у нее уже довольно большое комьюнити и выглядит покрасивее, хотя это уже на вкус.
+3
Вы хотели сказать «плагин»? Спасибо, видел его. В моем случае, как я писал, хотелось легкого (вес определяющий), простого и не нагруженого решения.
0
у chosen есть один недостаток — подогнать его под основной дизайн сайта довольно сложно. При этом схожих стилей для остальных элементов форм, выполненных в том же стиле как и селекты в нем нет.
0
Тоже им пользуюсь.
0
За этот плагин спасибо!
0
Стрелки вверх-вниз вызывают смену выбранного и одновременно с этим открытие-закрытие окна на каждое нажатие стрелкой. Выглядит жутко.
Opera12/lin/64
Opera12/lin/64
0
могу еще порекомендовать данный вариант linkselect, имеет хороший API
0
Вы кстати написали бы, что требуется jQuery 1.7+, а то ведь не все веб-мастера обновляют библиотеку(.on() только с 1.7 появился).
0
Если добавить пункт с длинным текстом — начинаются проблемы :)
Эту проблему пока ни один заменитель селектов не решает, к сожалению.
Эту проблему пока ни один заменитель селектов не решает, к сожалению.
0
В таких случаях нужно ограничить ширину (допустим, max-width) и добавить свойство text-overflow.
white-space: nowrap;
max-width: 200px;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
overflow: hidden;
0
Баг двойных стрелок в линуксовом Chrome 17.0.963.26 dev.
Эта чёрная стрелка — от дефолтного выпадающего списка, если его спрятать (display: none), то всё нормально.
Эта чёрная стрелка — от дефолтного выпадающего списка, если его спрятать (display: none), то всё нормально.
0
НЛО прилетело и опубликовало эту надпись здесь
А почему нет поддержки такой удобной вещи как OPTGROUP? На своём веку помню лишь пару плагинов хоть с кривой и упрощенной, но поддержкой групп.
+1
На данный момент занес в TODO возможность отключить стилизицию к селектам с OPTGROUP, и атрибутом multiple select. Повторюсь: идея была только для стандартных селектов без этих возможностей. Редко встречаются. Если надо пддержка такой функциональности — используйте указанный в первом комментарии Chosen.
0
Хочется поведения выпадающих списков как у нативных. Кликнули на выпадающий список — он развернулся, кликнули еще раз — у вас он повторно развернулся, хотя в оригинале должен свернуться.
+1
НЛО прилетело и опубликовало эту надпись здесь
Спасибо. Проверю.
0
В мобильном Safari отображается выпадающий список и одновременно с ним появляется стандартный селектор в виде барабана. Выбор пункта на барабане и подтверждение кнопкой Done выделяет пункт в списке, который продолжает «свисать». Приходится повторно тапать по пункту, после чего список наконец сворачивается.
0
Ваш плагин я бы не назвал бы велосипедом, действительно предусмотрено большинство событий как у стандартного элемента select. Я бы посоветовал сделать срытие списка не по событию на документ, а при потере фокуса, как это реализовано в виджите popup jQueryUI, чтобы избежать конфликтов с другими плагинами.
0
Ребята, как мне необходима была сегодня эта статья! Спасибо! :)
+1
Не нашёл в демке — есть ли поддержка кнопки «reset»?
Пока ни у одного самописного селекта не видел сброса в начальное состояние при нажатии reset в форме, каждый раз приходится писать костыли вручную, поскольку спрятанный оригинальный селект сбрасывается, а на подменяющем его скриптовом селекте это никак не отражается.
Пока ни у одного самописного селекта не видел сброса в начальное состояние при нажатии reset в форме, каждый раз приходится писать костыли вручную, поскольку спрятанный оригинальный селект сбрасывается, а на подменяющем его скриптовом селекте это никак не отражается.
0
О ужас, не хотелось бы чтоб это было повсеместно.
0
Что именно?
0
такие селекты и прочее, очень в редких случаях это можно встроить в дизайн, чаще это излишнее…
0
А можно поинтересоваться, по какой причине их сложно встроить в дизайн?
0
Согласен с частью: да, мне как верстальщику легче оригинальные элементы, так привычнее и проще, но дизайн элементов все чаще и чаще изменяется (например элементы форм в наших мобильных устройствах). И не скажу, что это излишне…
0
Не стоит использовать классы вроде «done, open». Очень велика вероятность того, что аналогичные классы встретятся в проекте, где ваш селект будет использоваться (custom-select тоже кстати весьма популярный класс). Сделайте возможность задания своего класса, а вспомогательные классы пусть будут генерироваться с префиксом (.your-class-name-select-open, .your-class-name-select-done).
+1
Вообще селект понравился. Аккуратная верстка, симпатичен внешне. Буду контрибьютить.
+2
Правда есть вопросы по js:
1. Зачем вы конструктор вашего плагина делаете свойством объекта jQuery?
2. Почему не храните методы в прототипе?
1. Зачем вы конструктор вашего плагина делаете свойством объекта jQuery?
$.selectik = function(element, options) {}
/* source code */
$.fn.selectik = function(options) {
return this.each(function() {
if (undefined == $(this).data('selectik')) {
// create a new instance of the plugin
var selectik = new $.selectik(this, options);
$(this).data('selectik', selectik);
}
});
}
2. Почему не храните методы в прототипе?
// public method: disable list
selectik.disableCS = function(){}
// public method: enable list
selectik.enableCS = function(){}
// public method: width of select
selectik.setWidthCS = function(width){}
+2
За основу был взять шаблон для плагина Стефана Габоса. Мне понравилась идеи хранения методов и определение свойств именно в таком виде, поэтому и использовал.
Возможно в будущем будет переработана архитектура после всех доработок. Возьму на заметку!
Возможно в будущем будет переработана архитектура после всех доработок. Возьму на заметку!
+1
Ну если по поводу первого пункта еще можно поспорить: мало ли кто-то захочет запускать плагин как
Но методы нужно конечно в прототип пихать. Они же общие для всех инстансов, зачем их дублировать для каждого селекта.
Когда будете пересматривать архитектуру, загляните сюда (если конечно еще не заглядывали).
$.selectik(element, { option1: 'option' });
Но методы нужно конечно в прототип пихать. Они же общие для всех инстансов, зачем их дублировать для каждого селекта.
Когда будете пересматривать архитектуру, загляните сюда (если конечно еще не заглядывали).
+2
Мне не нравится такие несемантичные списки. DIV-ами и LI-шками рисовать вручную контрол? Вы, что застряли во времена DOS, когда каждая программа рисовала контролы как могла? Это шаг в прошлое. Я против распространения таких методов.
-1
1. Если дизайнер видет это не стандартно и пользователю будет удобно — то почему нет? Надо учитывать и тот фактор, что они будут выглядеть во всех браузерах одинаково.
2. Чем несемантичные?
2. Чем несемантичные?
0
1. Пикассо тоже всякую хрень рисовал, и у него даже есть поклонники, но это не значит, что это хорошие картины. То, что видит дизайнер никого не волнует. Пользователю удобно было бы, и если бы производители браузеров и стандартов реализовали эти фичи с стандартном элементе управления. А делать костыль из-за чьей-то лени — это не престижно и унизительно. Логичнее для мировой справедливости заставить лентяев из W3C быстрее работать. Одинаковое отображение во всех браузерах опять-таки зависит от того, как мировое население сумеет заставить программистов браузеров хорошо работать, а не пить кофе с печеньками.
2. Несемантичные тем, что парсеры таких списков писать неудобно — везде свои. Да и представьте, если бы программы для Windows сами рисовали на окне элементы управления. Что было бы?! Да даже GetWindowText не сработал бы! У каждой программы был бы свой GetWindowText.
Поставьте, пожалуйста, мне плюсов в карму за выражение моего собственного мнения отличного от мнения большинства.
2. Несемантичные тем, что парсеры таких списков писать неудобно — везде свои. Да и представьте, если бы программы для Windows сами рисовали на окне элементы управления. Что было бы?! Да даже GetWindowText не сработал бы! У каждой программы был бы свой GetWindowText.
Поставьте, пожалуйста, мне плюсов в карму за выражение моего собственного мнения отличного от мнения большинства.
-1
'+valueOption+'
Это жесть. Почему вместо текста option используется его value? Получается, я не могу использовать список вида:
По-умолчанию
Красный
Зеленый
Синий
+2
FireFox 12.0, селект разворачивается вверх.
0
Подскажите пожалуйста, как обрабатывать события вроде onchange?
Например, для цепочки селектов, или отправки формы сразу по смене, и т.п.
В демо и API такого примера не нашёл
Например, для цепочки селектов, или отправки формы сразу по смене, и т.п.
В демо и API такого примера не нашёл
0
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Selectik — стильные селекты