How to design custom drop down select box with css?

Envato Authors Theme Authors
1

Hey guys,

I want to know that, is it possible to customize dropdown select box. I mean the style of that aero and all that…

Waiting for your comments

VJ

2

It actually is,
I believe this tutorial will tell you how. Not sure which chapter though,

3

There are a variety of jQuery plugins you can use.

Here’s one: http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/

4

I was on jquery site yesterday, and noticed Filament Group are now major sponsor, never noticed this before.

Good links ( albeit we knew them, ) a great starting point and wished I had remembered these and pipped you to the post Mordauk, good work

5
mordauk said

There are a variety of jQuery plugins you can use.

Here’s one: http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/

I know there are Jquery plugins out there but my question is, Isn’t it possible without jquery.and only with css or html5?

6

There is no ‘consistent’ way to customize select elements. Most browsers only support less then a hand full of properties it will actually apply to the element. Which would be why there are so many javascript based solutions out there which allow ‘complete’ customization.

7

Yeah, unfortunately, if you want a consistent experience you have to use something like jQuery.

8

You won’t be able to do it in just CSS, but you can replicate the effect in jQuery. Here’s one I made earlier: http://nboxd.com/s/dropdown/