Customize your HTML select inputs without all the pain!
HTML:
<div>
<select>
<option>value 1</option>
<option>value 2</option>
</select>
<div class="snazzy_selected">placeholder</div>
</div>
Javascript:
$('select').snazzySelect();
<html>
<head>
<!-- add javascript and default styling to the page -->
<script type="text/javascript" src="jquery.snazzyselect.js"></script>
<link rel="stylesheet" href="jquery.snazzyselect.css" type="text/css" />
</head>
<body>
<form>
<div>
<select>
<option>value 1</option>
<option>value 2</option>
</select>
<div class="snazzy_selected">New Dropdown will go here</div>
<script type='text/javascript'>
$('select').snazzySelect();
</script>
</div>
</form>
</body>
</html>
* skinnable dropdowns * no changes necessary for serverside processing. * extracted from real-world production application (Socialcast - http://socialcast.com) * full unit test suite
* copy javascript and css files into your application
* add references to javascript and default css stylesheet
* wrap select tag in a div
* add placeholder div with the class snazzy_selected within the wrapper div
* initialize using $('my_field').snazzySelect();
Copyright © 2009 Ryan Sonnek. See LICENSE for details.