多級導航列表隨着選擇選項

我創建了「選擇」，「選項」和「OPTGROUP」 ...... 嵌套列表這裏是我的代碼多級導航列表隨着選擇選項

HTML

<div class="menu-2_small"> 
     <form name="nav-2"> 
     <select name="SelectURL" onchange="document.location.href=document.nav-2.SelectURL.options[document.nav-2.SelectURL.selectedIndex].value"> 
     <option value="#">Inspiration</option> 
     <option value="#">Coding</option> 
     <option id="show-further-option" value="#">Freebies 
      <optgroup id="further-option"> 
      <option value="#">Textures</option> 
      <option value="#">Fonts</option> 
      <option value="#">Brushes</option> 
      <option value="#">Vectors</option> 
      <option value="#">Icons</option> 
      </optgroup> 
     </option> 
     <option value="#">Design</option> 
     <option value="#">Tutorials</option> 
     <option value="#">Technology</option> 
     </select> 
    </form> 
    </div>

而CSS

.menu-2_small{ 
display:block; 
width:100%; 
height:35px; 
background-image:url(imgs/link-bg-small.jpg); 
background-repeat:no-repeat; 
background-size:100% 100%; 
} 
.menu-2_small select{ 
width:70%; 
background-image:url(imgs/link-bg-small.jpg); 
color:white; 
font-size:0.70em; 
margin:6px 0 0 1%; 
cursor:pointer; 


} 

.menu-2_small select option{background-image:url(imgs/link-bg-small.jpg);background-repeat:no-repeat;} 
.menu-2_small select option:hover{font-weight:bold;} 
optgroup{display:none;} 
option #show-further-option:hover optgroup{display:block;}

現在的問題是，當我將鼠標懸停在ID爲「節目，進一步選項」的選項，沒有顯示OPTGROUP不管我怎麼努力... 我該怎麼辦塔T'

來源

2013-06-12 Awais Umar

使用'label'屬性顯示optgroup名稱。

<option id="show-further-option" value="#">Freebies 
    <optgroup id="further-option" label="further-option"> 
     <option value="#">Textures</option> 
     ....

來源

2013-06-12 07:09:13 Paritosh

多級導航列表隨着選擇選項

回答

相關問題