jquery实现将html div在窗口中水平垂直居中效果,无论是否调整窗口大小
如图所示:
代码如下:
代码实现了字div在父div中的水平垂直居中效果.parent
{
width:500px;
height:500px;
background-color:red;
}
.children
{
width:200px;
height:100px;
background-color:green;
}
$(document).ready(function(){
$(window).resize(function(){
$(".children").css({
position:'absolute',
left:($(".parent").width() - $(".children").outerWidth())/2,
top:($(".parent").height() - $(".children").outerHeight())/2 + $(document).scrollTop()
});
});
$(window).resize();
})