jQuery Multiline Selectmenu

https://github.com/ainterpreting/jquery-multilineSelectmenu

by Marvin Herbold

HTML

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css">
<script src="https://rawgit.com/ainterpreting/jquery-multilineSelectmenu/master/jquery.multilineSelectmenu.js"></script>
<link rel="stylesheet" href="https://rawgit.com/ainterpreting/jquery-multilineSelectmenu/master/jquery.multilineSelectmenu.css">
<select id="select">
  <option>The White House | 1600 Pennsylvania Avenue | Washington, D.C. 20500</option>
  <option>Access Interpreting | 1100 H St NW Ste 440 | Washington, D.C. 20005</option>
  <option>Prime Mininster | 10 Downing Street | London, England</option>
</select>

CSS

/* Not only is multiline support added - the options are completely CSS themeable as well! */

.ui-selectmenu-menu-item-header {
  text-decoration: underline;
}

.ui-selectmenu-menu-item-content {
  font-style: italic;
}

JavaScript

$("#select").multilineSelectmenu();