用 iframe 解決下拉框與層之沖突
問題提出:我用dw做了一個(gè)下拉菜單,但是碰到form的列表項(xiàng)就跑到下面去了,請(qǐng)幫忙解決,請(qǐng)看問題圖示
解決問題:由于層與下拉框之間的優(yōu)先級(jí)是:下拉框 > 層,因此在顯示的時(shí)候,會(huì)因?yàn)閮?yōu)先級(jí)的次序而會(huì)出現(xiàn)如上問題。(如果幾個(gè)元素都是層的話,我們可以通過層的 z-index 屬性來設(shè)置)解決辦法就是:給層中放一個(gè)優(yōu)先級(jí)比下拉框更高的元素(iframe),從而解決此問題!具體解決代碼如下:
<div id="menu" style="position:absolute; visibility:hidden; top:20px; left:20px; width:100px; height:200px; background-color:#6699cc;">
<table>
<tr><td>item 1</td></tr>
<tr><td>item 2</td></tr>
<tr><td>item 3</td></tr>
<tr><td>item 4</td></tr>
<tr><td>item 5</td></tr>
</table>
<iframe src="javascript:false" style="position:absolute; visibility:inherit; top:0px; left:0px; width:100px; height:200px; z-index:-1; filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe>
</div>
<a href="#" >menu</a>
<form>
<select><option>A form selection list</option></select>
</form>
關(guān)鍵詞:iframe
閱讀本文后您有什么感想? 已有 人給出評(píng)價(jià)!
- 1
- 1
- 1
- 1
- 1
- 1