Based on the jquery implementation of the picture in a variety of resolutions in the unknown container up and down around the center _jquery

Div:

Copy Code code as follows:

<div class= "Pic_conent" >
<div class= "Fn-pr pic_layer" >
<!--picture text introduction transparent layer-->
<section class= "BG text_layer_home p10 Font-yahei FN-BC" >

<aside class= "F12 BBB" >
<c:if test= "${not Empty Pic.poi}" >
<span class= "Scenery FN-FL" >${pic.poi}</span>
</c:if>
<span class= "Fn-fr mt10" >by ${pic.username}</span>
</aside>
</section>
</div>
</div>

Css:

Copy Code code as follows:

. pic_conent{
height:720px;/* This height will be JS get rid of * *
Text-align:center;
Display:table-cell;
Vertical-align:middle;
}
. pic_layer{text-align:center width:100%; display:inline-block; vertical-align:middle;}

Jquery:

Copy Code code as follows:

$ (function () {
var Surh = $ (window). Height ();
$ (". Pic_conent"). Height (surh);
Window.onresize=function () {
var Surh = $ (window). Height ();
$ (". Pic_conent"). Height (surh);
}