我正在设计的网站在正文后面有一个固定的菜单。单击菜单图标时，某些 jquery 会将主体向左移动。我在 body 上放了一个阴影，使固定菜单看起来像是位于下方。在 chrome、firefox 和 safari 中，一切都完美无缺。但是在 Internet Explorer 中，由于正文中的阴影，无法单击此菜单中的链接。是否有解决此问题的简单方法，或者可以轻松禁用 ie 上的 css 的方法？
相关代码如下:
主要内容上的阴影
.wrapper {
-webkit-box-shadow: 3px 0px 10px 1px rgba(0,0,0,1);
-moz-box-shadow: 3px 0px 10px 1px rgba(0,0,0,1);
box-shadow: 3px 0px 10px 1px rgba(0,0,0,1);
}
单击菜单按钮时显示的固定菜单。
.sidemenu {
position: fixed;
right: 0px;
top: 0px;
width: 260px;
height: 100%;
background: #2b2b2b;
z-index: -10;
overflow: hidden;
transition: 0.2s;
color: white;
text-align: center;
}
这有效: 添加了一个 javascript 函数来检测 Internet Explorer。
if (detectIE() != false) {
$('.sidemenu').css('zIndex', '1000');
}
单击菜单时，会调整 ie 上的索引以绕过所有其他层。效果很好。
最佳答案
嗯……有几件事会有所帮助；比如哪个版本的 IE 你看到这个问题？
但是，听起来像是设置一个 z-index:在这些链接上更高可以做到这一点。
.menu {
position: relative; // works best if parent is set to relative
}
.menu li a {
// all it's styles
z-index: 1001; //add
}
如果以上方法单独不起作用，请尝试设置一个较低的 z-index到页面包装器或 <body>如果这就是您在这种情况下必须使用的全部内容。 Eg. z-index: 888;有关 z-index 堆叠顺序的信息，请查看此 reference (updated) .
但您确实需要向我们展示您用来完全调试它的实际代码。
我很好奇你的 box-shadow: 是怎么写的你不应该做更多的事情 (只对你想要这种效果的外部元素，尝试移动到页面包装器而不是 body 标签)
.shadow {
-moz-box-shadow: inset 0 0 10px #000000;
-webkit-box-shadow: inset 0 0 10px #000000;
box-shadow: inset 0 0 10px #000000;
}
关于javascript - 投影阻止 Internet Explorer 中的链接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30874769/