Определение высоты страницы
Столкнулся с проблемой.
Задача: нужно элементом div затемнить всю область веб страницы, для этого нужно определить его высоту. Делаю так: document.getElementById('fon').style.height = document.body.offsetHeight + 'px'; После этого остаётся такое явление: ![]() Пробовал ещё вариант: document.getElementById('fon').style.height = window.screen.height + 'px'; но он вставляет скролл, если его нет, потому что высота получается больше чем страничка. Подкиньте пожалуйста какую-нибудь идейку. |
document.getElementById('fon').style.height = '100%'; document.getElementById('fon').style.width = '100%'; |
Опять же, выставляется высота видимой части страницы,
а если перемотать скролл вниз, то получается явление идентичное верхнему изображению. Затемняется только изначально видимая часть страницы. |
Кажется я понял почему так происходит,
блин, у меня же в CSS указаны настройки top:0; left:0;, поэтому див и отображается не зависимо от положения скроллинга... Ща буду править. Изменил положение top diva и всё заработало. var html = document.documentElement; document.getElementById('fon').style.top = html.scrollTop +"px"; |
Можно до кучи делать body css overflow:hidden
|
saint_byte, да, но мне нужно было, чтобы прокрутка изначально работала и отображалась на странице.
|
Как я понимаю надо накладывать тень на страницу?
Вот попробуй мой код (требует 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, время: 12:28. |