JavaScript设置自适应居中

一、样式设置：

body{
　　position: relative;
}
.box{
　　height: 200px;
　　width: 200px;
　　background: red;
　　position: absolute;
}

二、HTML部分：

<div class="box"></div>

三、脚本部分：

<script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script>
<script>
　　//设用自适应居中函数
　　auto();
　　//当该表浏览器窗口时，调用函数
　　$(window).resize(function(){
　　　　auto();
　　});
　　function auto(){
　　　　var L = ($(document).width() - $(".box").width())/2;
　　　　var H = ($(document).height() - $(".box").height())/2;
　　　　//alert("L:"+L+",H:"+H);
　　　　$(".box").css({
　　　　left: L + "px",
　　　　top: H + "px"
　　　});
　　}
</script>

转载于:https://www.cnblogs.com/zdliu/p/4756320.html