javascript - ie7 的 jquery.selectbox-0.2 问题 - 下拉菜单出现在元素后面而不是前面

Question

我正在使用http://code.google.com/p/select-box/选择框 jquery 插件，以便我可以更改选择框的外观。

该插件很棒并且工作正常，除了在 ie7 中，下拉列表出现在它们碰巧重叠的任何元素后面。这似乎是一个已知问题，但似乎没有人回答报告它的人。

我想知道是否有人可以建议修复？

这个问题可以在这里看到：http ://code.google.com/p/select-box/issues/detail?id=8

谢谢你的帮助 ：）

Answer 1

您可以使用这个在 dom 就绪上运行的一小段 jquery 代码来使用这个解决方案：

$(function() {  
    var zIndexNumber = 1000;  
    $('div').each(function() {  
        $(this).css('zIndex', zIndexNumber);  
        zIndexNumber -= 10;  
    });  
}); 

或尝试修复 css z-indexing：http ://web.enavu.com/snippets/fixing-the-ie7-z-index-issue-internet-explorer-7-z-index/

工作小提琴：http: //jsfiddle.net/IrvinDominin/aTUC5/

Answer 2

这也可以通过为下拉 div 提供更高的 z-index 值和为位于其下方并显示文本的每个 div 提供较小的 z-index 来解决。

前任：

<div id="sbHolder_28376079" class="sbHolder" tabindex="0">
    ...
    </div>
    <div class="div1">
        <div class="div2">
            <div class="div3">
            </div>
        </div> 
    </div>


.sbHolder{z-index : 100;}
.div1{z-index : 90;}
.div2{z-index : 80;}
.div3{z-index : 70;}

这应用了与上面 js 中提到的相同的逻辑，但它在使用绝对位置和 z-index 的其他部分破坏了我的 Ui。