Jquery IE8 z索引错误

我正在尝试表示我的一些内容之间的亲子关系，请看一看

在FF中，黑线（CSS类：“subvel”|

z-index:-1

|表示关系）位于我的框下（CSS类：“case”|没有z-index，即使使用“1”也不起作用）。 现在我有一个IE8的问题，黑线是最重要的

我已经看了一些关于它的话题，但没有找到任何有用的答案

注意：我还使用饼图生成漂亮的圆形边框和一些阴影。我不知道这会不会引起什么问题

代码 HTML

<div id="relatedCases2">
    <div class="legend">
        <div class="legendUnit"><div class="statusIcon s_op"></div> <span>Open</span></div>
        <div class="legendUnit"><div class="statusIcon s_ip"></div> <span>In progress</span></div>
        <div class="legendUnit"><div class="statusIcon s_pe"></div> <span>Pending</span></div>
        <div class="legendUnit"><div class="statusIcon s_cl"></div> <span>Closed</span></div>
        <div class="legendUnit"><div class="statusIcon s_cr"></div> <span>Closed / Unresolved</span></div>
    </div>
    <div class="case">
        <span class="caseSum">Title</span>
        <span class="caseLabel">No. :</span> <span class="caseField">00000000</span><br />
        <span class="caseLabel">Time :</span> <span class="caseField">15d 12h36m</span><br />
        <span class="caseLabel">Pending :</span> <span class="caseField">5d 7h02m</span><br />
    </div>
    <div class="case lvl1">
        <span class="caseSum">Title</span>
        <span class="caseLabel">No. :</span> <span class="caseField">00000000</span><br />
        <span class="caseLabel">Time :</span> <span class="caseField">15d 12h36m</span><br />
        <span class="caseLabel">Pending :</span> <span class="caseField">5d 7h02m</span><br />
    </div>
    <div class="case lvl1">
        <span class="caseSum">Title</span>
        <span class="caseLabel">No. :</span> <span class="caseField">00000000</span><br />
        <span class="caseLabel">Time :</span> <span class="caseField">15d 12h36m</span><br />
        <span class="caseLabel">Pending :</span> <span class="caseField">5d 7h02m</span><br />
    </div>
    <div class="case lvl2">
        <span class="caseSum">Title</span>
        <span class="caseLabel">No. :</span> <span class="caseField">00000000</span><br />
        <span class="caseLabel">Time :</span> <span class="caseField">15d 12h36m</span><br />
        <span class="caseLabel">Pending :</span> <span class="caseField">5d 7h02m</span><br />
    </div>
    <div class="case lvl1">
        <span class="caseSum">Title</span>
        <span class="caseLabel">No. :</span> <span class="caseField">00000000</span><br />
        <span class="caseLabel">Time :</span> <span class="caseField">15d 12h36m</span><br />
        <span class="caseLabel">Pending :</span> <span class="caseField">5d 7h02m</span><br />
    </div>
</div>

Javascript

var count1 = 1;
var count2 = 1;
$(".case").each(function () {
    if ($(this).hasClass("lvl2")) {
        $(this).data("index", count2++);
        count1++;
    } else if ($(this).hasClass("lvl1")) {
        count2 = 1;
        $(this).data("index", count1++);
    } else {
        count1 = 1;
        count2 = 1;
    }
});

$(".lvl1,.lvl2").each(function () {
    var offset = $(this).offset();
    var elHeight = $(this).outerHeight(true);
    var height = elHeight * ($(this).data('index') - 1);
    $(this).append("<div class=\"subLevel\" style=\"" +
        "left:" + (offset.left - 22) + "px;" +
        "top:" + (offset.top - elHeight / 2 - height) + "px;" +
        "height:" + (elHeight + height) + "px\"></div>");
});

var count1=1；
var count2=1；
$（“.case”）。每个（函数（）{
if（$（this.hasClass（“lvl2”））{
$（this.data（“index”，count2++）；
count1++；
}else if（$（this.hasClass（“lvl1”））{
count2=1；
$（this.data（“index”，count1++）；
}否则{
count1=1；
count2=1；
}
});
$（“.lvl1.lvl2”）。每个（函数（）{
var offset=$（this.offset（）；
var elHeight=$（this）.outerHeight（true）；
var height=elHeight*（$（this）.data（'index'）-1）；
$（此）。追加（“”）；
});

多亏了给出的评论和链接，我找到了一个解决方案。我在分享，我可以帮助别人

这是一个与派有关的问题

解决办法是：

在具有

行为：url（[PIE_path]）的元素上，将css属性“position”设置为“relative”

检查并解决与此变更相关的任何定位问题

---

这里是=）

如果问题出在饼图上，您可以尝试使用jquery corner作为边界半径： jquery.corner.js（）

---

来源：@sudip，

这是由CSS3 PIE引起的问题。请参阅。谢谢，但我不明白解决方法的诀窍：/另一个问题是，这不是完整的HTML片段。类为

子级的元素在哪里？编辑：啊，你正在使用jQuery添加一个
div
。尝试将
位置从
绝对
更改为
相对
。找到了一个解决方案，我写了它。谢谢
var count1 = 1;
var count2 = 1;
$(".case").each(function () {
    if ($(this).hasClass("lvl2")) {
        $(this).data("index", count2++);
        count1++;
    } else if ($(this).hasClass("lvl1")) {
        count2 = 1;
        $(this).data("index", count1++);
    } else {
        count1 = 1;
        count2 = 1;
    }
});

$(".lvl1,.lvl2").each(function () {
    var offset = $(this).offset();
    var elHeight = $(this).outerHeight(true);
    var height = elHeight * ($(this).data('index') - 1);
    $(this).append("<div class=\"subLevel\" style=\"" +
        "left:" + (offset.left - 22) + "px;" +
        "top:" + (offset.top - elHeight / 2 - height) + "px;" +
        "height:" + (elHeight + height) + "px\"></div>");
});