Propriedade de estilo zIndex
Exemplo
Altere a ordem da pilha de um elemento <img>:
document.getElementById("img1").style.zIndex = "1";
Definição e uso
A propriedade zIndex define ou retorna a ordem de pilha de um elemento posicionado.
Um elemento com maior ordem de pilha (1) está sempre na frente de outro elemento com menor ordem de pilha (0).
Dica: Um elemento posicionado é um elemento com a propriedade position definida como: relativa, absoluta ou fixa.
Dica: Esta propriedade é útil se você deseja criar elementos sobrepostos.
Suporte ao navegador
Property | |||||
---|---|---|---|---|---|
zIndex | Yes | Yes | Yes | Yes | Yes |
Sintaxe
Retorne a propriedade zIndex:
object.style.zIndex
Defina a propriedade zIndex:
object.style.zIndex = "auto|number|initial|inherit"
Valores de propriedade
Value | Description |
---|---|
auto | The browser determines the stack order of the element (based on its order in the document). This is default |
number | An integer that defines the stack order of the element. Negative values are allowed |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Detalhes técnicos
Valor padrão: | auto |
---|---|
Valor de retorno: | Uma String, representando a ordem de pilha de um elemento |
Versão CSS | CSS2 |
Mais exemplos
Exemplo
Altere o valor da propriedade z-index de um elemento <div>:
document.getElementById("myDIV").style.zIndex = "-1";
Exemplo
Retorne o valor da propriedade z-index de um elemento <img>:
alert(document.getElementById("img1").style.zIndex);
Páginas relacionadas
Tutorial CSS: Posicionamento CSS
Referência CSS: propriedade z-index
❮ Objeto de estilo