`
menjoy
  • 浏览: 417314 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

利用JS把Div等对象水平、垂直居中

阅读更多

<script type="text/javascript">
<!--
//使用说明:
// 1、拷贝这段代码,引入JQuery库
// 2、设定把要居中的对象三个参数:_ww宽度,_hh高度,_id,对象id
_ww = 300;
_hh = 300;
_id = 'aaa';

$(document).ready(function(){
findDimensions();
window.onresize=findDimensions;
});

function findDimensions() {
var pleft = 0;
var ptop = 0;
var winWidth = 0;
var winHeight = 0;
var _obj = document.getElementById(_id);
//获取窗口宽度
if (window.innerWidth)
winWidth = window.innerWidth;
else if ((document.body) && (document.body.clientWidth))
winWidth = document.body.clientWidth;
//获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测,获取窗口大小
if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {
winHeight = document.documentElement.clientHeight;
winWidth = document.documentElement.clientWidth;
}
ptop = (winHeight-_hh)/2;
pleft = (winWidth-_ww)/2;

_obj.style.top=ptop+"px";
_obj.style.left=pleft+"px";
}
//-->
</script>

0
3
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics