Horje
js multi section listbox Code Example
js multi section listbox
<p>  Rank features important to you when choosing where to live. If a feature is unimportant, move it to the unimportant features list.</p><div class="listbox-area">  <div class="left-area">    <span id="ss_imp_l">      Important Features:    </span>    <ul id="ss_imp_list"        tabindex="0"        role="listbox"        aria-labelledby="ss_imp_l">      <li id="ss_opt1" role="option">        Proximity of public K-12 schools      </li>      <li id="ss_opt2" role="option">        Proximity of child-friendly parks      </li>      <li id="ss_opt3" role="option">        Proximity of grocery shopping      </li>      <li id="ss_opt4" role="option">        Proximity of fast food      </li>      <li id="ss_opt5" role="option">        Proximity of fine dining      </li>      <li id="ss_opt6" role="option">        Neighborhood walkability      </li>      <li id="ss_opt7" role="option">        Availability of public transit      </li>      <li id="ss_opt8" role="option">        Proximity of hospital and medical services      </li>      <li id="ss_opt9" role="option">        Level of traffic noise      </li>      <li id="ss_opt10" role="option">        Access to major highways      </li>    </ul>    <div role="toolbar"         aria-label="Actions"         class="toolbar">      <button id="ex1-up"              class="toolbar-item selected"              aria-keyshortcuts="Alt+ArrowUp"              aria-disabled="true">        Up      </button>      <button id="ex1-down"              class="toolbar-item"              tabindex="-1"              aria-keyshortcuts="Alt+ArrowDown"              aria-disabled="true">        Down      </button>      <button id="ex1-delete"              class="toolbar-item move-right-btn"              tabindex="-1"              aria-keyshortcuts="Alt+ArrowRight Delete"              aria-disabled="true">        Not Important      </button>    </div>  </div>  <div class="right-area">    <span id="ss_unimp_l">      Unimportant Features:    </span>    <ul id="ss_unimp_list"        tabindex="0"        role="listbox"        aria-labelledby="ss_unimp_l"        aria-activedescendant="">    </ul>    <button id="ex1-add"            class="move-left-btn"            aria-keyshortcuts="Alt+ArrowLeft Enter"            aria-disabled="true">      Important    </button>  </div>  <div class="offscreen">    Last change:    <span aria-live="polite" id="ss_live_region"></span>  </div></div>
Source: www.w3.org
js multi section listbox
<p>  Choose upgrades for your transport capsule.</p><div class="listbox-area">  <div class="left-area">    <span id="ms_av_l">      Available upgrades:    </span>    <ul id="ms_imp_list"        tabindex="0"        role="listbox"        aria-labelledby="ms_av_l"        aria-multiselectable="true">      <li id="ms_opt1"          role="option"          aria-selected="false">        Leather seats      </li>      <li id="ms_opt2"          role="option"          aria-selected="false">        Front seat warmers      </li>      <li id="ms_opt3"          role="option"          aria-selected="false">        Rear bucket seats      </li>      <li id="ms_opt4"          role="option"          aria-selected="false">        Rear seat warmers      </li>      <li id="ms_opt5"          role="option"          aria-selected="false">        Front sun roof      </li>      <li id="ms_opt6"          role="option"          aria-selected="false">        Rear sun roof      </li>      <li id="ms_opt7"          role="option"          aria-selected="false">        Privacy cloque      </li>      <li id="ms_opt8"          role="option"          aria-selected="false">        Food synthesizer      </li>      <li id="ms_opt9"          role="option"          aria-selected="false">        Advanced waste recycling system      </li>      <li id="ms_opt10"          role="option"          aria-selected="false">        Turbo vertical take-off capability      </li>    </ul>    <button id="ex2-add"            class="move-right-btn"            aria-keyshortcuts="Alt+ArrowRight Enter"            aria-disabled="true">      Add    </button>  </div>  <div class="right-area">    <span id="ms_ch_l">      Upgrades you have chosen:    </span>    <ul id="ms_unimp_list"        tabindex="0"        role="listbox"        aria-labelledby="ms_ch_l"        aria-activedescendant=""        aria-multiselectable="true">    </ul>    <button id="ex2-delete"            class="move-left-btn"            aria-keyshortcuts="Alt+ArrowLeft Delete"            aria-disabled="true">      Remove    </button>  </div>  <div class="offscreen">    Last change:    <span aria-live="polite" id="ms_live_region"></span>  </div></div>
Source: www.w3.org




Javascript

Related
remove duplicate item from array javascript Code Example remove duplicate item from array javascript Code Example
public JsonResult what is the return Code Example public JsonResult what is the return Code Example
Quantity of Numbers Between in python Code Example Quantity of Numbers Between in python Code Example
double click sur image change javascript Code Example double click sur image change javascript Code Example
undefined behavior: the order of volatile accesses is undefined in this statement Code Example undefined behavior: the order of volatile accesses is undefined in this statement Code Example

Type:
Code Example
Category:
Coding
Sub Category:
Code Example
Uploaded by:
Admin
Views:
7