|
|
|
| Как расположить абсоютно позиционированный div посередине окна браузера (по вертикали)? Если задать параметр top:20%, то отсчет идет от верха документа, а не экрана. | |
|
|
|
|
|
|
|
для: Киналь
(23.03.2008 в 10:37)
| | function putLayer() {
var topLayer = (getWindowHeight() - 340)/2 /// 340 - vusota sloya !
document.getElementById(\"contents\").style.top = topLayer + \"px\"
}
....
<body onload=\"putLayer();\" onresize=\"putLayer();\" ... >
.... | |
|
|
|
|
|
|
|
для: Киналь
(23.03.2008 в 10:37)
| | Ой!!! Не надо вам ни каких JavaScrip'ов. Зачем?
Ниже выкладываю код для расположения посередине окна браузера изображения. По аналогии делаете и для слоя (<img> меняете на <div>)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>В разработке</title>
<style type="text/css">
* {
margin:0;
padding:0;
}
html,
body {
height:100%;
}
html {
overflow:auto;
}
#middle {
position:relative;
height:100%;
width:100%;
overflow:hidden;
}
#horizont {
position:absolute;
top:50%;
left:50%;;
width:0;
height:0;
}
#horizont img {
display:block;
position:relative;
width:463px;
height:600px;
margin:-300px 0 0 -232px;
}
</style>
</head>
<body>
<div id="middle">
<div id="horizont">
<img src="" width="463" height="600" alt="В разработке" />
</div>
</div>
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: Madman
(24.03.2008 в 19:44)
| | Все это, ели н ошибаюсь, будет от верхнего края документа, а не окна. Вобщем, погуглил потщательнее и нашел вот такой скрипт:
function mousePageXY(e)
{ var x = 0, y = 0;
var coord=new Array();
if (!e) e = window.event;
if (e.pageX || e.pageY)
{ x = e.pageX;
y = e.pageY;
}
else if (e.clientX || e.clientY)
{ x = e.clientX + (document.documentElement.scrollLeft ||
document.body.scrollLeft) - document.documentElement.clientLeft;
y = e.clientY + (document.documentElement.scrollTop ||
document.body.scrollTop) - document.documentElement.clientTop;
}
coord[0]=x;coord[1]=y;
return coord;
}
|
Самое ценное тут - document.documentElement.scrollTop ||
document.body.scrollTop, что я благополучно и применил)
Но все равно - спасибо за ответы! | |
|
|
|
|
|
|
|
для: Киналь
(24.03.2008 в 21:48)
| | Уточню, что если вы поместите абсолютно позиционируемый блок в body (т.е. чтобы body был его родителем) и внесете в CSS вот такое правило html, body {height:100%}, то при любых раскладах, блок будет позиционироваться поцентру окна браузера, но только в том случае, если нет скроллера (т.е. контент полностью влезает на страницу).
В противном случае, используйте вместо absolute - fixed (для нормальных браузеров), а для IE либо expression, либо можно тоже сделать средствами CSS эмуляцию fixed.
Тогда у вас блок будет всегда поцентру рабочей области окна браузера... | |
|
|
|
|
|
|
|
для: Madman
(24.03.2008 в 23:30)
| | >но только в том случае, если нет скроллера (т.е. контент полностью влезает на страницу).
Вот-вот. Я потому это вначале и оговорил.
А fixed использовать пробовал, но тогда посыпалась вся верстка на div\'ах) Вобщем сейчас работает - и ладно. Спасибо еще раз. | |
|
|
|