Turn off the zoom effect on the lead image?

Hi there, on my homepage here and other posts: http://www.jamjosandbox.com/mag/ the lead image has this zoom in type effect on it which I am sure many find nice. I will not have the most amazing images on my website so I need to deactivate this zooming effect and essentially have no effect at all if possible.

Thanks,
James

Hi,

Try to add the following code into the theme’s css/override.css file (make sure to enable the “Use the override.css file” option in Template options > Advanced in the WordPress backend)

Code: Select all

.gk-nsp-art .gk-nsp-image:hover {
   -webkit-transform: none;
   -moz-transform: none;
   -ms-transform: none;
   -o-transform: none;
   transform: none;
}


Thanks worked great

Sorry to open this ticket up again, but the zoom effect still works on the single posts pages like this one http://www.jamjosandbox.com/mag/henri-h ... s-digital/ do you have a piece of css that could deactivate this zoom across the entire website? Thanks for your time.

Try to add also this code:

Code: Select all

article figure.featured-image:hover img {
   -webkit-transform: none;
   -moz-transform: none;
   -ms-transform: none;
   -o-transform: none;
   transform: none;
}


Thank you that seemed to do the trick here. Appreciate that.

Sorry to have to bring this up again but if you look at my site here: http://www.jamjosandbox.com/mag you can see on the right hand side that there is the Tab widget and again the zoom effect appears here I would like to turn it off? Likewise on the footer area of my site you can see the Video section and again there is a zoom effect here. Also in the mainbody section you can see the News Show Pro has 3 smaller thumbnails and there is a zoom effect here.

So in these 3 places it would be great to again get some css to switch this effect off. Thanks

No problem, try to add also this code:

Code: Select all

.gk-nsp-links .gk-image-link:hover img,
.gk-nsp-video_list .gk-nsp-image-wrap:hover img {
   -webkit-transform: none;
   -moz-transform: none;
   -ms-transform: none;
   -o-transform: none;
   transform: none;
}