Square Image Hover

Square Image Hover 

Square Image Hover seperti gambar di atas, jika gambar di sorot mouse maka akan berbentuk bulat.

Kode css nya:

img{

opacity:0.7;

border:none;

padding:0px;

-webkit-transition: all 0.5s ease-in-out;

-moz-transition: all 0.5s ease-in-out;

-o-transition: all 0.5s ease-in-out;

-ms-transition: all 0.5s ease-in-out;

transition: all 0.5s ease-in-out;

border-radius:10px;

}

img:hover{

border-radius:30px;

opacity: 1;

}

css di atas juga menimbulkan efek terang pada gambar. silahkan di coba!