Created
July 2, 2019 16:11
-
-
Save mtribone/e34a706c78985b28c5b00f68d3fece43 to your computer and use it in GitHub Desktop.
HTML with Enhanced Code for JS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="field"> | |
<label for="destination"> | |
<span class="field-label">Destination</span> | |
</label> | |
<select name="destination" aria-hidden="true" tabindex="-1" class="visually-hidden"> | |
<!-- options here --> | |
</select> | |
<div class="autocomplete"> | |
<input aria-owns="autocomplete-options--destination" autocapitalize="none" type="text" autocomplete="off" aria-autocomplete="list" role="combobox" id="destination" aria-expanded="false"> | |
<svg focusable="false" version="1.1" xmlns="http://www.w3.org/2000/svg"> | |
<!-- rest of SVG here --> | |
</svg> | |
<ul id="autocomplete-options--destination" role="listbox" class="hidden"> | |
<li role="option" tabindex="-1" aria-selected="false" data-option-value="1" id="autocomplete_1">France</li> | |
<li role="option" tabindex="-1" aria-selected="true" data-option-value="2" id="autocomplete_2">Germany</li> | |
<!-- more options here --> | |
</ul> | |
<div aria-live="polite" role="status" class="visually-hidden">13 results available.</div> | |
</div> | |
</div> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment