JS获取窗口中间坐标

kart15 2008-12-12 11:02:27

请问各位大侠,JS获取屏幕中间坐标怎么写啊?
我是想做一个这样的程序,点击一个按钮的时候,弹出一个DIV,然后将DIV始终显示在屏幕的中间,
还有就是显示在窗口的中间又是怎么写,
请各位帮帮忙

...全文

594 13 打赏收藏转发到动态举报

写回复

用AI写文章

13 条回复

切换为时间正序

请发表友善的回复…

发表回复

mengxj85 2008-12-12

打赏
举报

[Quote=引用 5 楼 kart15 的回复:]
function bl2(title)
{
s=title;
div2.style.left=200;
div2.style.top=200;
document.getElementById( "div2").style.display = "block";
document.getElementById('imgdd').src=s;
}
这是我的代码
我想让div2.style.top=中间,上面楼上的我都试了,不行啊
[/Quote]
我IE7，三楼的方法没问题



function bl2(title) 

{ 

    var s=title; 

    vat div2=document.getElementById( "div2");

    div2.style.left=200;  

    div2.style.top=200; 

    div2.style.display = "block"; 

    document.getElementById('imgdd').src=s; 

}

这样试试

kart15 2008-12-12

打赏
举报

是要显示在屏幕的中间

kart15 2008-12-12

打赏
举报

function bl2(title)
{
s=title;
div2.style.left=200;
div2.style.top=200;
document.getElementById( "div2").style.display = "block";
document.getElementById('imgdd').src=s;
}
这是我的代码
我想让div2.style.top=中间,上面楼上的我都试了,不行啊

wtcsy 2008-12-12

打赏
举报

<div id="box" style="width:100%"><div>test</div></div>

<body><div id="ss" style="height:200px; width:200px; background-color:#FF0000; position:absolute"></div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></body>

<script>

var isIE = (document.all) ? true : false

var div  = document.getElementById("ss")

var top  = (document.body.clientHeight-div.offsetHeight)/2

var left = (document.body.clientWidth-div.offsetWidth)/2

function change()

{  

   div.style.left=(document.body.clientWidth-div.offsetWidth)/2

   div.style.top =(document.body.clientHeight-div.offsetHeight)/2+document.body.scrollTop

   top = (document.body.clientHeight-div.offsetHeight)/2

   left = (document.body.clientWidth-div.offsetWidth)/2

}

change()

var oContainer = document.getElementById("box");

if(isIE){

    oContainer.onresize=change

}else{

    window.onresize=change

}



window.onscroll=function(){div.style.top=top+document.body.scrollTop}

</script>

囧 2008-12-12

打赏
举报



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>无标题文档</title>

<style type="text/css">

	#divTest{

		background:#F1F1F1; border:1px solid #006699; height:100px; width:100px;

	}

</style>

<script type="text/javascript">

function move(){

	var obj = document.getElementById("divTest");

	obj.style.display = "";

	

	var clientWidth = document.documentElement.clientWidth;

	var clientHeight = document.documentElement.clientHeight;

	var objWidth = obj.offsetWidth;

	var objHeight = obj.offsetHeight;

	var x = ( clientWidth - objWidth ) / 2;

	var y = ( clientHeight - objHeight ) / 2;

	

	obj.style.position = "absolute";

	obj.style.left = x + "px";

	obj.style.top = y + "px";

}

</script>

</head>



<body>

<input type="button" value="测试" onclick="move()" />

<div id="divTest" style="display:none">

	测试内容

</div>

</body>

</html>

上海_童鞋 2008-12-12

打赏
举报

<div id="ly" style="position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;
z-index: 2; left: 0px; display: none;">
</div>
<div id="Layer2" align="center" style="position: absolute; z-index: 3; left: expression((document.body.offsetWidth-400)/2); top: expression((document.body.offsetHeight-170)/2);
background-color: #fff; display: none;" >
<table width="400" border="0" cellpadding="0" cellspacing="0" style="border: 0 solid #e7e3e7;
border-collapse: collapse">
<tr> <td height="130" align="center">Text
</td>
</tr>
</table>
</div>

<script language=javascript>
function locking()
{
document.all.ly.style.display="block";
document.all.ly.style.width=document.body.clientWidth;
document.all.ly.style.height=document.body.clientHeight;
document.all.Layer2.style.display='block';
}
</script>
<script language=javascript defer>
locking();
</script>

lu_huanling 2008-12-12

打赏
举报



<body> 

	<div id="ss" style="height:200px; width:200px; background-color:#FF0000; position:absolute;z-index:2;"> </div> 

<br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> 

</body> 

<script> 

var div  = document.getElementById("ss") 

var top  = (document.body.clientHeight-div.offsetHeight)/2 

var left = (document.body.clientWidth-div.offsetWidth)/2 

var obj = document.getElementById("ss"); 

function change() 

{  

  //div.style.left=(document.body.clientWidth-div.offsetWidth)/2 

  //div.style.top =(document.body.clientHeight-div.offsetHeight)/2+document.body.scrollTop 

  top = (document.body.clientHeight-div.offsetHeight)/2 

  left = (document.body.clientWidth-div.offsetWidth)/2 

  div.style.left = left + "px"; 

  div.style.top = top + "px"; 

  obj.innerHTML = top + " <br/>"; 

  obj.innerHTML += left;  

} 

change();

window.onresize=change 

window.onscroll=function(){div.style.top=top+document.body.scrollTop} 

</script>

dh20156 2008-12-12

打赏
举报

参见：

http://www.v-ec.com/dh20156/code/crossframe/x.html

kart15 2008-12-12

打赏
举报

上面楼上的,不行啊

kart15 2008-12-12

打赏
举报

当我点击链接的时候用什么方法是页面不会移动到最上面啊

囧 2008-12-12

打赏
举报

汗,,上面那个写反了



div2.style.display = "block";

div2.style.top = (document.documentElement.clientHeight - div2.offsetHeight) / 2 + document.documentElement.scrollTop + "px";

div2.style.left = (document.documentElement.clientWidth - div2.offsetWidth) / 2 + document.documentElement.scrollLeft + "px";

囧 2008-12-12

打赏
举报



div2.style.display = "block";

div2.style.top = (document.documentElement.clientHeight - div2.offsetWidth) / 2 + document.documentElement.scrollTop + "px";

div2.style.left = (document.documentElement.clientWidth - div2.offsetHeight) / 2 + document.documentElement.scrollLeft + "px";

kart15 2008-12-12