Форум

Vladimir1980 · #1 (**permalink**) 20.01.2010, 12:33

Киньте в меня примером как сделать div на весь браузер.
У меня сейчас сделано так, но если проскролить окно вниз то этот див высоко остается.

#wait_div
{
position:absolute;
left:0px;
top:0px;
float:top;
z-index:80;
background-color: #E1E1E1;
height:100%;
width:100%;
-moz-opacity: 0.2; /* код для движков Mozilla */
opacity:.20; /*свойство из спецификации CSS3, которое поддерживается не всеми браузерами*/
filter: alpha(opacity=20); /* код для IE */
}

Подозреваю что этому диву надо скриптом при скроллинге топ менять.

Kolyaj · #2 (**permalink**) 20.01.2010, 12:43

Сообщение от Vladimir1980

Подозреваю что этому диву надо скриптом при скроллинге топ менять.

Лучше высоту/ширину дива сразу поставить равной высоте/ширине документа. А при ресайзе окна скрывать див, пересчитывать размеры документа и опять показывать.

Vladimir1980 · #3 (**permalink**) 20.01.2010, 13:03

Ну а все же: как top скриптом менять при скроллинге?

Kolyaj · #4 (**permalink**) 20.01.2010, 13:11

el.style.top = '100px';

Nekromancer · #5 (**permalink**) 20.01.2010, 13:38

по идее див должен перекрывать весь документ, и скролл.. как вариант всё обернуть в один контейнер место боди, а в боди контейнер и этот див..

<body>
<div id="conteiner"></div>
<div id="wait_div"></div>
</body>

ну всё в принципе

Vladimir1980 · #6 (**permalink**) 20.01.2010, 13:45

Сообщение от Nekromancer

по идее див должен перекрывать весь документ, и скролл.. как вариант всё обернуть в один контейнер место боди, а в боди контейнер и этот див..

<body>
<div id="conteiner"></div>
<div id="wait_div"></div>
</body>

ну всё в принципе

А если по центру экрана еще картинку "Ждите..." надо

Nekromancer · #7 (**permalink**) 20.01.2010, 13:56

#wait_div {background: url('loading.png') center center no-repeat;}

HelpeR · #8 (**permalink**) 20.01.2010, 21:37

if(!this.ie6 && window.innerWidth && window.innerHeight && window.screen && window.screen.width && window.screen.height) {
            winWidth  = parseInt(window.innerWidth);
	        winHeight = parseInt(window.innerHeight);
	  
	        maxWidth  = parseInt(window.screen.width);
	        maxHeight = parseInt(window.screen.height);
        }
        if(this.ie) {
            if(document.documentElement.clientWidth && document.documentElement.clientHeight && document.body && document.body.offsetWidth && document.body.offsetWidth) {
                winWidth    = parseInt(document.documentElement.clientWidth);
	            winHeight   = parseInt(document.documentElement.clientHeight); 
		
		        maxWidth    = parseInt(document.body.offsetWidth);
	            maxHeight   = parseInt(document.body.offsetHeight);
            }
        }

получаете полный размер документа (с учетом скроллинга)

subzey · #9 (**permalink**) 21.01.2010, 01:18

Для нормальных браузеров используем position: fixed.
Для остального, шестой версии, используем фикс: http://www.howtocreate.co.uk/fixedPosition.html

PeaceCoder · #10 (**permalink**) 24.01.2010, 02:25

Сообщение от subzey

Для нормальных браузеров используем position: fixed.
Для остального, шестой версии, используем фикс: http://www.howtocreate.co.uk/fixedPosition.html

Фишка fixed не в том чтобы элемент стоял на месте, его и через этот фикс да можно сделать, а в том что бы небыло полос прокрутки если элемент за пределами браузера.

Форум

Справочник

Discord чат

Курсы javascript