jQuery dropdownlist dropdownlist behaviour - maikelbos0/VDT GitHub Wiki

By default, when a jQuery-dropdownlist is opened it opens downwards with whatever height the original element was set to. To create a more dynamic experience, you can set the data-dynamic-positioning attribute to true. When this setting is enabled, the dropdownlist will open upwards if there's not enough room downwards. If there's not enough room in either direction, the dropdownlist will open downwards with an adjusted maximum height.

<div id="example-dropdown" data-dynamic-positioning="true">
    <div data-value="1">Choice number 1</div>
    <div data-value="1a">Option 1a</div>
    <div data-value="3">Second choice</div>
    <div>Final option</div>
</div>

<script type="text/javascript">
    $('#example-dropdown').dropdownlist();
</script>