CSS/JavaScript:使元素最顶层的z-index /最顶层的模态元素

Question

我想让一个元素(例如a <div>)成为页面上最顶层的元素.

我的假设是,我能做到这一点的唯一方法是指定元素的style="z-index:"值是浏览器允许的最大值(int32？).

它是否正确？

相反,它有可能以某种方式获取元素z-index,其最高,使这个<div>的z-index了[highest element's value] + 1？例如:

$myDiv.css("z-index", $(document.body).highestZIndex() + 1);

模态JavaScript"windows"如何工作？

Answer 1

这是怎么做的:

var elements = document.getElementsByTagName("*");
var highest_index = 0;

for (var i = 0; i < elements.length - 1; i++) {
    if (parseInt(elements[i].style.zIndex) > highest_index) {
        highest_index = parseInt(elements[i].style.zIndex;
    }
}

highest_index现在包含页面上最高的z-index ...只需将1添加到该值并将其应用于您想要的任何位置.你可以像这样申请:

your_element.style.zIndex = highest_index + 1;

这是使用jQuery实现相同功能的另一种方法:

var highest_index = 0;

$("[z-index]").each(function() {
    if ($(this).attr("z-index") > highest_index) {
         highest_index = $(this).attr("z-index");
    }
});

同样,将新索引应用于元素的方式相同:

$("your_element").attr("z-index", highest_index + 1);

Answer 2

http://abcoder.com/javascript/a-better-process-to-find-maximum-z-index-within-a-page/ -> 找到最大 z-index 并为其分配+1。