.figcaption {
width:277px;
height:290px;
background:url("http://www.jq22.com/img/cs/500x500b.png") no-repeat;
background-size:100% 100%;
position:relative;
overflow:hidden;
}
.figcaption:hover img {
transform:scale(3,3);
opacity:0;
transition:all 0.5s ease-in-out;
}
.figcaption:hover .more {
transform:scale(1,1) rotate(0deg);
opacity:1;
transition:all 0.5s ease-in-out;
}
.more {
background:skyblue;
width:60px;
height:40px;
text-align:center;
line-height:40px;
position:absolute;
top:50%;
left:50%;
margin-left:-30px;
margin-top:-20px;
transition:0.3s ease-in-out;
transform-origin:50% 50%;
transform:scale(0,0) rotate(-45deg);