Chosen Image

Extends the functionaility of the Chosen plugin by Harvest to display inline images in dropdown menus

View Example

Usage

Add attribute data-img-src to <option> items with the source of your image file.

<select data-placeholder="Choose a Project..." class="my-select" style="width:350px;" tabindex="2">
  <option data-img-src="chosenImage/flag-red.gif">Project A</option> 
  <option>Project B</option> 
</select>

Use chosenImage() in place of chosen() passing in the same properties:

$(".my-select").chosenImage({
  disable_search_threshold: 10 
});

All properties of chosen() are available through chosenImage()

By default images are resized to 12px tall in chosenImage.css

Dependencies

• jQuery 1.4+
• Chosen