1

我到处寻找解决方案,但无法弄清楚。解决方案让我望而却步。

由于复杂的原因,我不能简单地更改 CSS 中的边距/填充交换,所以我尝试style="z-index:5;"在第一个 div 中添加,然后style="z-index:4;"在第二个 div 中添加,等等,以便页面上的最后一个元素具有最低z-index,并且向顶部的每个元素添加一个,因此如果有任何重叠,它始终保持在顶部,这是当前位于后续兄弟元素下方的某些链接的情况。

剥离下面的示例代码:我知道我的计数器正在工作,但是增量器 (z) 的值没有传递给.cssfor 循环中的方法。有什么建议么?

<style>
.subsection {
    margin-top: -80px;
    padding-top: 80px;
    position: relative;
}
</style>

<script>
    var set_zindex = function(){
        var subsection = $('.subsection');
    var subsections = subsection.length;
    var z;
    for ( z=subsections; z >=0; z-- ) {
        subsection.css('z-index', z );
    }
}
set_zindex();
</script>

<html>
<div class="subsection">some content</div>  //add style="z-index:5:
<div class="subsection">some content</div>  //add style="z-index:4:
<div class="subsection">some content</div>  //add style="z-index:3:
<div class="subsection">some content</div>  //add style="z-index:2:
<div class="subsection">some content</div>  //add style="z-index:1:
</html>
4

2 回答 2

3

您正在使用 jQuery 集合(var 小节)。您需要分别查看该集合中的每个项目。

就像是:

subsection.each(function(i){
  $(this).css('z-index', subsection.length-i);
});
于 2012-12-20T01:06:08.773 回答
0

您应该在 for 循环中使用 z -= 1 。有时事情会变得很糟糕。看这里

并与每个迭代。

subsection.each
  (
    function(i) {
         $(this).css('z-index',subsections-i);
    } 
  )
;
于 2012-12-20T01:04:30.750 回答