0

不过我有一个奇怪的问题,当我单击 z-index 20 的内容时,z-index 1 的内容会在我的手机中被选中。

该图像有两个屏幕截图 - 图像右侧的部分仅用于说明我的问题,因此白色灰色 div 位于我的内容 div 后面。

有人可以救救吗。

相关的 CSS 文件:

#content {
background: #000000;
background: url(../img/WireFrame_test.png) center center no-repeat;
box-shadow: 0 0 15px 15px #222222;
overflow-x: hidden;
z-index: 20;
}

.snapjs-right .snap-drawer-right {
    display: block;
    z-index: 10;
}

.snapjs-right .snap-drawer-left {
    display: block;
    right: 0;
    left: auto;
    z-index: 1;

}

根据要求的相关 HTML 脚本:

<body>
<div class="snap-drawers" id="leftid">

...

<div class="snap-drawer snap-drawer-right overthrow">
<div>
<h3>Questions</h3>
<div class="demo-social">
</div>
<h4>Java</h4>
<ul>
<li><a href="noDrag.html">What is Java?</a></li>
<li><a href="noDrag.html">Uses of Inheritence?</a></li>

...

</div>
</div>
<div id="content" class="snap-content">
my content goes here

</div>
</div>
</body>

在此处输入图像描述

4

2 回答 2

0

当然,因为“继承的使用”是唯一的链接元素(除了“什么是 java”),它将被选中 - 没有其他选择!

尝试在隐藏时将该元素的显示设置为“无”。

于 2013-09-05T15:32:26.117 回答
0

You could try to hook into the event when clicking / dragging on the content panel and do an event.stopPropagation(); or an event.preventDefault(); when the panel is closed. As far as i know, you can see that coz Snap.js add's corresponding classes like (class="snapjs-right" or class="snapjs-left") to the body in order to indicate if a panel is open or not.

So first you've got to check that.

With jQuery it would look something like this:

$(document).ready(function() { 
    $("#UsesofInheritence_Anchor_ID").bind("click", function() {
        if (!($('body').hasClass("snapjs-right"))){
            event.stopPropagation();
            event.preventDefault();
        }
    });
});
于 2013-10-16T16:26:04.740 回答