<div class="dszoomimage">
<a href="#" title="gelesson.net">
<img src="http://up.gelesson.net/_ph/3/2/898757559.png" alt="gelesson.net" >
</a>
<a href="#" title="gelesson.net">
<img src="http://up.gelesson.net/_ph/3/2/898757559.png" alt="gelesson.net">
</a>
<a href="#" title="gelesson.net">
<img src="http://up.gelesson.net/_ph/3/2/898757559.png" alt="gelesson.net">
</a>
</div>
<style>
.dszoomimage {
text-align:center;
background:transparent;
}
.dszoomimage a img {
width:150px;
height:250px;
display:block;
border:0;
position:relative;
top:0;
left:0;
-webkit-transition: all 0.5s ease-in;
-moz-transition: all 0.5s ease-in;
-o-transition: all 0.5s ease-in;
-ms-transition: all 0.5s ease-in;
transition: all 0.5s ease-in;
}
.dszoomimage a {
display:inline-block;
width:150px;
height:250px;
position:relative;
}
.dszoomimage a:hover img {
width:300px;
height:500px;
position:absolute;
top:-20px;
left:-20px;
box-shadow: 0 10px 15px rgba(0,0,0,0.5);
z-index:7;
}
</style>