jQuery Bulletize
Demo 
Get the codeThis can be used to make forms easier to fill in. Bulletize will convert a <select> into a list of bullets, each bullet representing an <option> inside the <select>.
Events can still be binded to the <select>, for example .change(). I have used the change() event on one of our projects to load trough AJAX a different section of the page, based on what option has been selected.
Short Docs
By default each bullet will display the label of each option ( the text between <option></option> ). There are 2 ways to control the display:
- showLabel ( by default is true ) - this triggers the display of the label
- showIndexNo ( by default is false ) - when this is true, it displays a number inside the bullet. This number is the position of the option.
Comments and improvements can be added here.
I have tested on
IE 7 and 8, Opera 10, Firefox 3.5 and 3.6, Safari 4, Chrome. It
would run smoothly on all major web browsers, although there are some
minor rendering issues with Opera, but I will update the code soon. Yes, the round corners are CSS3.
Leave a Comment :