Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Определение высоты страницы (https://javascript.ru/forum/misc/21578-opredelenie-vysoty-stranicy.html)

nematod 15.09.2011 20:59
Определение высоты страницы
 
Столкнулся с проблемой.
Задача: нужно элементом div затемнить всю область веб страницы, для этого нужно определить его высоту.
Делаю так:
document.getElementById('fon').style.height = document.body.offsetHeight + 'px';

После этого остаётся такое явление:


Пробовал ещё вариант:
document.getElementById('fon').style.height = window.screen.height + 'px';

но он вставляет скролл, если его нет, потому что высота получается больше чем страничка.

Подкиньте пожалуйста какую-нибудь идейку.

Magneto 15.09.2011 21:07 
document.getElementById('fon').style.height = '100%';
document.getElementById('fon').style.width = '100%';

nematod 16.09.2011 13:58
Опять же, выставляется высота видимой части страницы,
а если перемотать скролл вниз, то получается явление идентичное верхнему изображению.
Затемняется только изначально видимая часть страницы.

nematod 16.09.2011 14:15
Кажется я понял почему так происходит,
блин, у меня же в CSS указаны настройки top:0; left:0;,
поэтому див и отображается не зависимо от положения скроллинга...
Ща буду править.

Изменил положение top diva и всё заработало.
var html = document.documentElement;
document.getElementById('fon').style.top = html.scrollTop +"px";

saint_byte 16.09.2011 15:33
Можно до кучи делать body css overflow:hidden

nematod 16.09.2011 15:54
saint_byte, да, но мне нужно было, чтобы прокрутка изначально работала и отображалась на странице.

saint_byte 20.09.2011 14:30
Как я понимаю надо накладывать тень на страницу?
Вот попробуй мой код (требует mootoos 1.3)
var DarkBox = new Class({
 Implements: [],
         initialize: function(zindex){
           zindex = zindex||10;  
           if (!$('darkbox')) {
           new Element("div",{id:"darkbox",
                           "class":"opacity50",
                           styles :{
                               'z-index':zindex,
                               height:$(window).getScrollSize().y+"px"
                           }
                       }).inject($(document.body));
         }   
         },
         close: function() {
            try { $('darkbox').dispose() } finally {} 
         }
         // if not darkbox
});

Полупрозрачность класс opacity50 - сообрази сам =)


Часовой пояс GMT +3, время: 10:07.