Question

请查看此网页 - http://dev.topyaps.com/how-awesome-are-you

这篇文章是由我开发的wordpress插件构建的。由于元素的z索引属性，我面临各种问题。问题是 -

1）滚动时，菜单会与页面上的浮动条合并。菜单的CSS -

kodda_container {
z-index: 999 !important;
width: 1220px;
height: 40px !important;
background-color: ;
border-top: solid transparent;
border-right: solid transparent;
border-bottom: solid transparent;
border-left: solid transparent;
background-image: -webkit-linear-gradient(top, transparent, transparent);
}

浮动栏的Css -

.scoreBox {
    background: #fafafa;
    border: 1px solid #d1d1d1;
    width: 100%;
    z-index: 997;
}

2）单击提交按钮时，会出现一个中心框。中心盒在隐藏时必须位于顶部。

中心框的Css -

element.style {
    padding: 6px;
    word-wrap: break-word;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -18px;
    margin-left: -206px;
    z-index: 999;
    display: block;
}

3）尝试点击主页上的登录和注册按钮 - http://dev.topyaps.com/。这是登录/注册弹出窗口的实际样式。但在帖子中＃34;你有多棒？＆＃34; ，当我们点击登录/注册时，样式会更改为中心框的样式（单击“提交”按钮时显示的样式）。

登录框的Css -

element.style {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -163.5px;
    margin-left: -230px;
    z-index: 10001;
}

请尝试告诉我解决这些问题的方法。

Answer 1

您的主页采用以下方式设置：

http://dev.topyaps.com/wp-content/plugins/simplemodal-login/css/default.css?ver=1.0.7

您的内容页面的样式由：

http://dev.topyaps.com/wp-content/plugins/challenges/modal/jquery.modal.css?ver=3.9.1

看起来你可能有两个相互矛盾的插件。

协助z索引导致各种错误

1 个答案: