Определение центра клиентской области

Статус
В этой теме нельзя размещать новые ответы.

Ratko

Постоялец
Регистрация
13 Сен 2008
Сообщения
93
Реакции
21
мне нужно выводить div в центр экрана. В диве img, src которого меняется. Из каких свойств элементов document или window можна вычислить середину экрана?
 
Код:
function OpenPhoto (ph) {
	if (ph == 1) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto1+'.jpg';}
	if (ph == 2) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto2+'.jpg';}
	if (ph == 3) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto3+'.jpg';}
	document.getElementById('mess').style.visibility='visible';
	document.getElementById('mess').style.top= getClientHeight()/2;
}
У мня страница занимает несколько экранов. Отступ происходит от начала документа, а не от начала экрана, и пользователю гичего не видно. Тут нужно учесть насколько проскролен документ, и прибавить к середине видимой области. Я никак немогу это свойство определить ((
 
document.scrollTop
document.scrollLeft

Только погугли по поводу кроссбраузерности.
 
можно прописать свойство для div
top:expression((document.documentElement.scrollTop + screen.height/2 - 100) + 'px');
left:expression((document.documentElement.scrollLeft + screen.width/2 - 100) + 'px');

работает в opera и ff, на счет ie не знаю
 
нашел пару функций:

Код:
function getClientWidth() {  
	return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;
}

function getClientHeight() {  
	return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientHeight:document.body.clientHeight;
}


function getBodyScrollTop() {  
	return self.pageYOffset || (document.documentElement && document.documentElement.scrollTop) || (document.body && document.body.scrollTop);
}

function getBodyScrollLeft() {  
	return self.pageXOffset || (document.documentElement && document.documentElement.scrollLeft) || (document.body && document.body.scrollLeft);
}


function getClientCenterX() {
    return parseInt(getClientWidth()/2)+getBodyScrollLeft();
}

function getClientCenterY() {
    return parseInt(getClientHeight()/2)+getBodyScrollTop();
}


function BuyPhoto (ph) {
	if (ph == 1) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto1+'.jpg';}
	if (ph == 2) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto2+'.jpg';}
	if (ph == 3) {document.getElementById('xxxphoto').src='./photos/'+xxxphoto3+'.jpg';}
	document.getElementById('mess').style.visibility='visible';
	
	document.getElementById('mess').style.top=getClientCenterY()-document.getElementById('mess').style.height/2;
	document.getElementById('mess').style.left=getClientCenterX()-document.getElementById('mess').style.width/2;
}

Во всех браузерах работает одинаково, но не учитывает вocument.getElementById('mess').style.height/2 и document.getElementById('mess').style.width/2. От чего такое может быть?



Спасибо, вопрос решен.
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху