js实现div居中

简介: test $(document).ready(function () { //alert(document.documentElement.clientHeight); //alert(document.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>test</title>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<link type="text/css" rel="stylesheet" href="http://j.laohe360.net/css/pub.css"/>
<script charset="utf-8" type="text/javascript" src="http://www.php100.com/statics/js//php100/js/jquery.js"></script>
<script>
$(document).ready(function () {
	//alert(document.documentElement.clientHeight);
	//alert(document.documentElement.clientWidth);
	var iWidth=500; //弹出窗口的宽度;
	var iHeight=400; //弹出窗口的高度;
	var iTop = (document.documentElement.clientHeight-iHeight)/2; //获得窗口的垂直位置;
	var iLeft = (document.documentElement.clientWidth-iWidth)/2; //获得窗口的水平位置;
	$("#tpsp").height(iHeight)
		.width(iWidth)
		.css('position','absolute')
		.css("top",iTop)
		.css("left",iLeft)
		.css("background",'red');
});

</script>
</head>
<body>


<div id="tpsp">
	
</div>


</body>
</html>

 

目录
相关文章
|
11天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
5月前
|
JavaScript
js通过input框输入属性和值,改变div的属性
js通过input框输入属性和值,改变div的属性
75 0
|
9月前
|
JavaScript
JS实现定时自动更换DIV或页面背景图片
JS实现定时自动更换DIV或页面背景图片
189 0
|
2月前
|
移动开发 前端开发 JavaScript
H5+CSS3+JS逆向前置——5、DIV+CSS百分比布局
H5+CSS3+JS逆向前置——5、DIV+CSS百分比布局
37 0
|
2月前
|
移动开发 前端开发 JavaScript
H5+CSS3+JS逆向前置——4、DIV+CSS绘制旗帜练习
H5+CSS3+JS逆向前置——4、DIV+CSS绘制旗帜练习
19 0
|
3月前
|
JavaScript
原生js实现div跳动效果---很多炫酷效果的基本原理
原生js实现div跳动效果---很多炫酷效果的基本原理
20 0
|
3月前
|
JavaScript 前端开发
原生js与jQuery显示隐藏div的几种方法
原生js与jQuery显示隐藏div的几种方法
36 0
|
3月前
|
JavaScript 前端开发
js小功能--如何实现按住shift拖拽多选div
js小功能--如何实现按住shift拖拽多选div
31 0
|
4月前
|
JavaScript
【经典】原生JS实现“用鼠标拖拽(drag)内容DIV”,滚动条对应同步滚动
【经典】原生JS实现“用鼠标拖拽(drag)内容DIV”,滚动条对应同步滚动
|
5月前
|
JavaScript
js隐藏和显示div
js隐藏和显示div