Download
User Rating: 2.5/5 ( 1 votes)
DropList is a lightweight jQuery plugin to custom UI style for drop down list. The plugin has droplist, multilist and combo list (search and dropdown) options
Source: droplist.vinmein.com
1. INCLUDE CSS AND JS FILES
<link rel="stylesheet" type="text/css" href="css/dropList.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="js/jquery.dropList.1.0.0.js"></script>
2. HTML
<div class="wrapper" id="dwrapper">
<select id="dlist">
<option value="default">cars</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
</div>
3. JAVASCRIPT
$(document).ready(function(){
$('#dlist').dropList({
selected : '["default"]'
});
});
4. OPTIONS
selected:
'["default"]' or '["saab","Honda"]'
Selected option will enable the default selection of the dropList. This selected option is applicable only for the standard and multiselect. It is not available for the search dropList
speed
200 or 300
speed is to determine the UI animation Speed, will accept integer values.
multiple
true/false
This one for enabling the multi selection option for the dropList.
search
true/false
search option is to enable the combo option (droplist with search box).
text
"Select your car"
text option for customize the textbox value of the combo dropList.
JS Tutorial
