Ширина в IE
Добрый день.
есть:
почему
возвращает 0???
:(
есть:
Код:
<div id="layer_name" style="position:absolute;top:100;left:100;"> ... </div>
почему
Код:
document.getElementById('layer_name').clientWidth
:(
Правильно так:
Код:
document.getElementById('layer_name').style.clientWidth
ой... че-то это я написал???
Что вы собственно хотите узнать?! ширину окна браузера? или слоя?!
Что вы собственно хотите узнать?! ширину окна браузера? или слоя?!
[QUOTE=RussianSpy]ой... че-то это я написал???
Что вы собственно хотите узнать?! ширину окна браузера? или слоя?![/QUOTE]
В Internet Explorer возвращает [COLOR="Red"]0[/COLOR]! проверил на двух компах с разной виндой и разными версиями IE (5, 6).
Мне надо узнать ширину слоя.
Что вы собственно хотите узнать?! ширину окна браузера? или слоя?![/QUOTE]
Код:
document.getElementById('layer_name').style.clientWidth
В Internet Explorer возвращает [COLOR="Red"]0[/COLOR]! проверил на двух компах с разной виндой и разными версиями IE (5, 6).
Мне надо узнать ширину слоя.
Если ширина не задана явно (<div style="width: 200px;"...), clientWidth и будет возвращать 0.
Можно использовать offsetWidth - document.getElementById('layer_name').offsetWidth.
Можно использовать offsetWidth - document.getElementById('layer_name').offsetWidth.
Есть такая замечательная вещь - DOM-инспектор. Предлагаю пользоваться им. Тогда подобные вопросы отпадут сами собой: там будет видно, что этот слой не имеет ширины.
А еще можно воспользоваться простеньким парсером свойств и методов объекта. Вот такая функция не раз спасала меня в ситуациях когда мозг напрочь отказывался вспоминать навороченную объектную модель документа.
Код:
<div id="console" style="width:950;height:400;"></div>
<script>
function tree(obj)
{
document.getElementById('console').innerHTML+="<UL>\n";
for (var i in obj)
{
document.getElementById('console').innerHTML+=("<LI>" + i);
if (typeof obj != "object")
{
document.getElementById('console').innerHTML+=(" = "+obj);
}
else document.getElementById('console').innerHTML+="</LI>";
}
document.getElementById('console').innerHTML+="</UL>\n";
}
</script>
<script>
function tree(obj)
{
document.getElementById('console').innerHTML+="<UL>\n";
for (var i in obj)
{
document.getElementById('console').innerHTML+=("<LI>" + i);
if (typeof obj != "object")
{
document.getElementById('console').innerHTML+=(" = "+obj);
}
else document.getElementById('console').innerHTML+="</LI>";
}
document.getElementById('console').innerHTML+="</UL>\n";
}
</script>
[QUOTE=RussianSpy]А еще можно воспользоваться простеньким парсером свойств и методов объекта. Вот такая функция не раз спасала меня в ситуациях когда мозг напрочь отказывался вспоминать навороченную объектную модель документа.
[/QUOTE]
А что передаётся в переменной obj???
[/QUOTE]
А что передаётся в переменной obj???
Любой объект. Например так
Код:
<script>
tree(document.getElementById('layer_name').style);
</script>
tree(document.getElementById('layer_name').style);
</script>
RussianSpy, за функцию спасибо, токо она не помогла в данном случае. Попробую подробней обяснить проблему.
Обясняю: Есть два слоя. Содержут динамическую информацию, по этому зарание определять ширину нельзя. Дизайн страницы не растягивается, по этоу если разрешение монитора больше, до дизайн распологается в центре. Данные слои надо расположить в правельном месте. Первый слой можно расположить изходя из ширины окна. Второй слой этимже способам правельно расположить нельзя, так как на разных разрешениях размещается по разному (негодитса). Способ, который я написал в коде для размещения "layer_submenu" работает только в Mozilla а в IE отказываетса. Пожалусто помогите :(
Может есть другой способ???
Код:
<script>
function ShowMenu(obj){
if(document.getElementById(obj).style.visibility='hidden')
document.getElementById(obj).style.visibility='visible';
else
document.getElementById(obj).style.visibility='hidden';
}
<div id="layer_menu" name="layer_menu" style="position:absolute; top:100; left:100; background-color:#ffffff;" onmouseover="ShowMenu('layer_submenu');" onmouseout="ShowMenu('layer_submenu');">
....
</div>
<div id="layer_submenu" name="layer_submenu" style="position:absolute; top:100; left:100; background-color:#ffffff;">
....
</div>
<script>
document.getElementById('layer_menu').style.left=(Math.ceil((document.body.clientWidth-1000)/2)+164); // первый слой, в незовисимости от разрешения екрана, ставится в нужном месте
document.getElementById('layer_subenu').style.left=document.getElementById('layer_menu').clientWidth+document.getElementById('layer_menu').offsetLeft;
</script>
function ShowMenu(obj){
if(document.getElementById(obj).style.visibility='hidden')
document.getElementById(obj).style.visibility='visible';
else
document.getElementById(obj).style.visibility='hidden';
}
<div id="layer_menu" name="layer_menu" style="position:absolute; top:100; left:100; background-color:#ffffff;" onmouseover="ShowMenu('layer_submenu');" onmouseout="ShowMenu('layer_submenu');">
....
</div>
<div id="layer_submenu" name="layer_submenu" style="position:absolute; top:100; left:100; background-color:#ffffff;">
....
</div>
<script>
document.getElementById('layer_menu').style.left=(Math.ceil((document.body.clientWidth-1000)/2)+164); // первый слой, в незовисимости от разрешения екрана, ставится в нужном месте
document.getElementById('layer_subenu').style.left=document.getElementById('layer_menu').clientWidth+document.getElementById('layer_menu').offsetLeft;
</script>
Обясняю: Есть два слоя. Содержут динамическую информацию, по этому зарание определять ширину нельзя. Дизайн страницы не растягивается, по этоу если разрешение монитора больше, до дизайн распологается в центре. Данные слои надо расположить в правельном месте. Первый слой можно расположить изходя из ширины окна. Второй слой этимже способам правельно расположить нельзя, так как на разных разрешениях размещается по разному (негодитса). Способ, который я написал в коде для размещения "layer_submenu" работает только в Mozilla а в IE отказываетса. Пожалусто помогите :(
Может есть другой способ???
А сколько же тут ошибок и очепяток!!!!!
Вот исправленная версия:
Может потому и не работает что много опечаток и синтаксических ошибок?!
Вот исправленная версия:
Код:
<script>
function ShowMenu(obj){
if(document.getElementById(obj).style.visibility=='hidden')
document.getElementById(obj).style.visibility='visible';
else
document.getElementById(obj).style.visibility='hidden';
}
<div id="layer_menu" style="position:absolute; top:100px; left:100px; background-color:#ffffff;" onmouseover="ShowMenu('layer_submenu');" onmouseout="ShowMenu('layer_submenu');">
....
</div>
<div id="layer_submenu" style="position:absolute; top:100px; left:100px; background-color:#ffffff;">
....
</div>
<script>
document.getElementById('layer_menu').style.left=(Math.ceil((document.body.clientWidth-1000)/2)+164);
document.getElementById('layer_submenu').style.left=document.getElementById('layer_menu').clientWidth+document.getElementById('layer_menu').offsetLeft;
</script>
function ShowMenu(obj){
if(document.getElementById(obj).style.visibility=='hidden')
document.getElementById(obj).style.visibility='visible';
else
document.getElementById(obj).style.visibility='hidden';
}
<div id="layer_menu" style="position:absolute; top:100px; left:100px; background-color:#ffffff;" onmouseover="ShowMenu('layer_submenu');" onmouseout="ShowMenu('layer_submenu');">
....
</div>
<div id="layer_submenu" style="position:absolute; top:100px; left:100px; background-color:#ffffff;">
....
</div>
<script>
document.getElementById('layer_menu').style.left=(Math.ceil((document.body.clientWidth-1000)/2)+164);
document.getElementById('layer_submenu').style.left=document.getElementById('layer_menu').clientWidth+document.getElementById('layer_menu').offsetLeft;
</script>
Может потому и не работает что много опечаток и синтаксических ошибок?!