gpt4 book ai didi

javascript - 投影阻止 Internet Explorer 中的链接

转载 作者:行者123 更新时间:2023-11-30 16:48:38 27 4
gpt4 key购买 nike

我正在设计的网站在正文后面有一个固定的菜单。单击菜单图标时,某些 jquery 会将主体向左移动。我在 body 上放了一个阴影,使固定菜单看起来像是位于下方。在 chrome、firefox 和 safari 中,一切都完美无缺。但是在 Internet Explorer 中,由于正文中的阴影,无法单击此菜单中的链接。是否有解决此问题的简单方法,或者可以轻松禁用 ie 上的 css 的方法?

enter image description here

相关代码如下:

主要内容上的阴影

.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/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com