javascript - IE 中的 Z 索引 : li element disappeared when over on it

Question

在 JS 代码中，我声明当超过垂直菜单中的 LI 元素时，所有 li 元素都获得样式:z-index:5 除了当前超过 li 元素和带有 class="selected" 的 li 元素，样式为:z-index: 10。在 chrome 中，FF 运行良好，但在 IE 中，当我在菜单的 li 元素上时它消失了。

JS代码如下:

var mainMenu_li = document.getElementById('mainMenu').getElementsByTagName('li');

for(i = 0; i < mainMenu_li.length; i++)
    if(mainMenu_li[i].className != "selected")
        mainMenu_li[i].style.zIndex = '5';

$('#' + curObjID).parent().css('z-index','10');

你能帮我什么忙？

Answer 1

首先阅读本系列文章:https://developer.mozilla.org/en/Understanding_CSS_z-index

如果您尝试在 IE7 中使用 z-index - 它有问题 - 尝试基于“没有 z-index 的堆叠”构建菜单。例如 - 没有悬停 position:static，有悬停 position:relative。

也尝试设置没有悬停 position:relative;(没有 z-index)和悬停 position:relative;z-index:2

如果将样式放入类中并通过类使用 jquery 进行操作会更好:addClass('class') 和 removeClass('class')