Не могу установить z-index с помощью CSS - PullRequest
Новая
       0

Не могу установить z-index с помощью CSS

3 голосов
/ 19 ноября 2010 
<html>
<head>
    <title>Sample</title>

    <script>
        window.onload = function()
        {
            alert(document.getElementById('div1').style.zIndex);
            alert(document.getElementById('div2').style.zIndex);
        }
    </script>

    <style type="text/css" media="screen">
        #div2
        {
            z-index: 1;
        }
    </style>
</head>
<body>
    <div id="div1" style="z-index:1"></div>
    <div id="div2"></div>
</body>

Результатом вышеприведенного кода является «1» для 1-го предупреждения и ничего для 2-го.

Почему я не могу установить z-индекс"div2" через CSS?

Спасибо.

Ответы [ 3 ]

3 голосов
/ 19 ноября 2010

1: он установлен, но JS не может определить его, если он не встроен
2: это не будет иметь никакого эффекта, если объект не позиционирован (как опубликовал gulbrandr)

относительно 1. Если он не установлен inline (или с помощью javascript), вы можете получить его, используя currentStyle или getComputedStyle , что дает вам текущий примененный стиль.

2 голосов
/ 19 ноября 2010

С W3Schools.com :

z-index работает только с позиционированными элементами (позиция: абсолютная, позиция: относительная или позиция: фиксированная)

1 голос
/ 19 ноября 2010

Набор свойств .style.* отображается непосредственно на свойства, установленные с помощью атрибута style , а не те, которые каскадируются из правильной таблицы стилей.

Чтобы найти вычисленный z-индекс, вам нужно использовать getComputedStyle

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...