CSS/JavaScript: Elemento elemento superior z-superior/elemento modal superior

Question

Me gustaría hacer que un elemento (por ejemplo, un <div>) sea la capa superior de la página.

Mi suposición es que la única forma en que puedo hacer esto es especificando que el elemento tiene un valor style="z-index:" que es el máximo que el navegador permite (int32?).

¿Es esto correcto?

lugar, ¿sería posible conseguir de alguna manera el z-index cuyo elemento es de más alta, y hacer de este <div> 's z-index la [highest element's value] + 1? Por ejemplo:

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

¿Cómo funcionan las "ventanas" de JavaScript modal?

Answer 1

http://abcoder.com/javascript/a-better-process-to-find-maximum-z-index-within-a-page/ -> busque el máximo z-índice y asígnele +1.

Answer 2

Así es como se hace:

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 contiene ahora el más alto índice z en la página ... sólo tiene que añadir a ese valor 1 y se aplica siempre que lo desee. Se puede aplicar de este modo:

your_element.style.zIndex = highest_index + 1; 

Ésta es otra manera de lograr lo mismo usando jQuery:

var highest_index = 0; 

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

Una vez más, la misma forma de aplicar el nuevo índice a un elemento:

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

Answer 3

La solución de jQuery de Sheavi no funciona porque el índice z es un estilo CSS, no un atributo.

Tal vez puedas probar:

raiseToHighestZindex = function(elem) { 
    var highest_index = 0; 
    $("*").each(function() { 
     var cur_zindex= $(this).css("z-index"); 
     if (cur_zindex > highest_index) { 
      highest_index = cur_zindex; 
      $(elem).css("z-index", cur_zindex + 1); 
     } 
    }); 
    return highest_index; 
}; 

Valor de retorno puede no ser lo que se espera debido a la naturaleza asíncrona de Javascript, pero llamando a la función en cualquier elemento no tendrán ningún problema.

Answer 4

¿Qué pasa con el contexto de apilamiento? Es no siempre cierto que: En un documento, el índice Z más alto estará en la parte superior. Ver: http://philipwalton.com/articles/what-no-one-told-you-about-z-index/. Si no se tiene en cuenta el contexto de apilamiento, la configuración de mil millones puede no ser suficiente para que su elemento ocupe el primer lugar.