CSS Image Zoom Hover



You may also like...

6 comments
arcarr01
arcarr01

Hi,

did you know that this CSS code doesn't work for IE9? Do you know what it's failing?

Great work by the way,

Kind Regards

arcarr01
arcarr01

Hi, did you know that this CSS code doesn't work for IE9? Do you know what it's failing? Great work by the way, Kind Regards

designifyme
designifyme moderator

@BizarroSkull

Hi BizzaroSkull

In order to get more zoom, you have to edit the scaling in the CSS: 


div.hover-details:hover > img

{

transform: scale(1.2);

-ms-transform: scale(1.2);

-webkit-transform: scale(1.2);

-o-transform: scale(1.2);

-moz-transform: scale(1.2);

}

If you change the "scale(1.2);" to "scale(2.2)" you will see how the image is zoomed more. 

Thanks.



designifyme
designifyme

BizarroSkull Hi BizzaroSkull In order to get more zoom, you have to edit the scaling in the CSS:  div.hover-details:hover > img { transform: scale(1.2); -ms-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); -moz-transform: scale(1.2); } If you change the "scale(1.2);" to "scale(2.2)" you will see how the image is more zoomed.  Thanks.