Как стилизовать select?

Question

[Роман Павлов]

Заранее хочу извиниться за такой вопрос, прекрасно понимаю сколько раз он поднимался и решался.

Собственно, есть select, который надо стилизовать.

Само собой гуглил. Нашел много плагинов для jQuery, но не понимал, как их использовать.
Можете тыкнуть пальцем что именно делать?

С JS есть трудности :(

Answer 1

[Константин Величко]

dimox.name/jquery-form-styler
хороший плугин, рекомендую
работает как на мобилках так и на ie7

Comments

[Роман Павлов]

Спасибо, Ваш вариант мне почему то понравился больше :)
Смотрел данное решение, но с первого раза не понял, как, собственно, стилизовать, а оказалось, просто внимательно прочитать таблицу на сайте

[Виталий Киренков]

А если много пунктов и пользователь на тач-устройстве, как себя это поведёт?

[Роман Павлов]

@DeLaVega для мобильных устройств редирект на мобильную версию

[Виталий Киренков]

Ууу...
Сами говорите о незнании js, и при этом предпочитаете вариант с ним, ежели чем использовать нативные методы, путём одного ксс.

[Роман Павлов]

@DeLaVega путем одного css с селектами далеко не уйдешь, а с js у меня просто трудности, это не говорит о моем незнании его

Answer 2

[Grag]

Вот. Есть пару багов, но норм работает. Под мобилки и планшеты все под гонять самому.

Comments

[Роман Павлов]

Пробовал данный вариант, при клике на блок абсолютно ничего не происходит

Answer 3

[Виталий Киренков]

Лично я рекомендовал бы это делать без js, ибо нативный селект кроссбраузерный, и кроссплатформенный. Как правило вся проблема стилизации упирается в стрелочку. Так вот начальный вид можно и чистым ксс-ом стилизовать. Пример с хабра.
Если возникнут вопросы, касательно того, Как это работает - обращайтесь.

Comments

[Алексей Ермолаев]

C этим способом возникает проблема текста опшона, который может быть длинным и перекрывать стрелку. text-overflow:ellipsis и white-space:nowrap не спасают. Все равно текст растягивается на всю ширину селекта.

Answer 4

[pauletik]

kate-land.net/html-css/item/336-cross-browser-styl...

Comments

[pvasili]

Вариант уже описывался и он кривой при большом тексте в селекте всё налезает на кнопку..