JavaScript и zIndex свели меня с ума... почти :)

behappy · №1

В firefox 3.0.1 не работает смена z-index с помощью JavaScript.
В opera 9.52 и IE 6 работает.

вот код. При нажатии на кнопку "change z-index" зеленый прямоугольник должен расположиться поверх желтого.

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ Без Имени</title>
<script type="text/javascript">
function z(){
	green.style.zIndex = 2;
	yellow.style.zIndex = 1;
}

</script>
<style type="text/css">
#green{
position:absolute;
top:10;
left:10;
background-color:green;
width:100px; height:50px;
z-index:1;
}

#yellow{
position:absolute;
top:10;
left:10;
background-color:yellow;
width:50px; height:100px;
z-index:2;
}
</style>
</head>

<body>
<input type="button" value="change z-index" onclick="z()" />
<div id="green">
green
</div>
<div id="yellow">
yellow
</div>

</body>
</html>

Отредактировано behappy (19-09-2008 21:27:30)

Infocatcher · №2

Инструменты – Консоль ошибок:

Выделить код

Код:

Предупреждение Ошибка при анализе значения свойства «top».  Потерянное объявление.
Источник: file:///...html
Строка: 17
 ----------
Предупреждение Ошибка при анализе значения свойства «left».  Потерянное объявление.
Источник: file:///...html
Строка: 18
 ----------
Предупреждение Ошибка при анализе значения свойства «top».  Потерянное объявление.
Источник: file:///...html
Строка: 26
 ----------
Предупреждение Ошибка при анализе значения свойства «left».  Потерянное объявление.
Источник: file:///...html
Строка: 27
 ----------
Ошибка: green is not defined
Источник: file:///...html
Строка: 8

Во-первых, нужно указывать единицу измерения (top: 10px;), а во-вторых, используйте document.getElementById("id").

behappy · №3

Спасибо!
Использование document.getElementById("id") оказалось критичным для ff, в отличие от opera и IE

Полезная информация

№119-09-2008 21:24:46

JavaScript и zIndex свели меня с ума... почти :)

Код:

№219-09-2008 21:38:24

Re: JavaScript и zIndex свели меня с ума... почти :)

Код:

№319-09-2008 22:37:40

Re: JavaScript и zIndex свели меня с ума... почти :)

Board footer