2009-10-24 164 views
1

我需要一個白色框,當點擊該按鈕時,在該文本框下方將出現灰色邊框。下拉菜單中會顯示5到10行文字,這些文字在瀏覽器頂部顯示URL的外觀和感覺。需要「可編輯的下拉列表」

我可以用div做這個嗎?

<script> function $(id) { return document.getElementById(id); } </script> 
<input name="media" id="media" type="text" /> 
<input type="button" value="..." onclick="$('keypad').style.display='inline-block';"/> 

<div id="keypad" onmouseout="$('keypad').style.display='none'" style="display:none; background:#FFF; vertical-align:top;"> 
    Canvas 
    Steel 
    Vinyl 
    Paper 
</div> 
+1

可能的重複:http://stackoverflow.com/questions/1616940/editable-dropdown – 2009-10-24 17:27:39

+0

dup http://stackoverflow.com/questions/1616940/editable-dropdown – elcuco 2009-10-24 18:09:52

回答

1

簡單的下拉與CSS:

<div id="mine"> 
    <ul id="nav"> 
    <li>some title here 
     <ul> 
     <li>Discription about the title</li> 
     <li>as many as you like</li> 
     </ul> 
    </li> 
    </ul> 
</div> 

和CSS文件:

#nav {margin: 0; 
padding: 7px 6px 0; 
line-height:100%;} 

#nav ul {display: none; 
margin: 0; 
padding: 0; 
width:200px; 
position:absolute; 
left:0; 
z-index:2;} 

#nav li:hover > ul {display: block;} 

,當然,易於定製的CSS。