Simple Dropdown List Plugin with jQuery and jQuery UI - Drop List

Drop List is a jQuery & jQuery UI plugin which turns the standard select list into a fully stylable, multi-selectable and searchable dropdown list.

How to use it:

1. Include the necessary jQuery & jQuery UI in the html page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

2. Include the jQuery drop list plugin's javascript and CSS in the page.

<link rel="stylesheet" href="css/dropList.css" />
<script src="js/jquery.dropList.1.0.0.js"></script>

3. Create a standard select list in the page.

<select id="demo">
  <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>

4. Call the plugin on the select list and you're done.

$('#demo').dropList();	

5. Available options with defaults.

$('#demo').dropList({
text: "Select your car",
speed: 200, // animation speed

type: "dropdown",
search: false, // searchable
multiple: false, // multiple select
selected: '["default"]'
});

6. Tweak or override the styles in the dropList.css to create your own styles whatever you want.

---

This awesome jQuery plugin is developed by dineshhv. For more Advanced Usages, please check the demo page or visit the official website.