Remove mouse over effect on portfolio items [hover effect on portfolio items]

DrTrust · December 2014

Hi,

Is there a way to remove the mouse over effect from the portfolio items?

Greetings

Albert · December 2014

Hi,

do you mean this magnifying glass, links on blue background or maybe both?

DrTrust · January 2015

Both, and mainly the crop effect on the image

Albert · January 2015

Please use below css then to remove this effect:

.image_frame .image_wrapper .mask { display: none; }
.image_frame .image_wrapper .image_links { display: none; }
.image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }

DrTrust · January 2015

thank you

Albert · January 2015

You're welcome

egeo · February 2015

Hello, in my version of Betheme when I hover over an image the effects are the following:
1. an upward motion of the image within its frame
2. a smooth color transmission towards a slightly transparent white.

Is it possible, and how, to eliminate the first, motion effect, and keep the later, whitening effect?
(I would prefer, if possible, that the editing be global - not just for the portfolio)

Thank you

Albert · February 2015

@egeo Please send us url to page where you got this hover effect because we are not sure which item you exactly used and we must have a look on it.

egeo · February 2015

Here's the url
http://www.marilouwp.creative-architects.gr/?portfolio=project-1

thank you for your help

Albert · February 2015

Ok. So to remove this upward motion on hover, please use below css:

.image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }

egeo · February 2015

It is a very good theme, but the support... your support is excellent. Thank you!

Albert · February 2015

It is really nice to hear such a great words

We really appreciate it. Thanks!

insondavel · February 2015

This code also serves to remove those damned icons from the Blog image hover?

Albert · February 2015

@insondavel If you mean the code that we used under 1st reply, then yes, it works for icons.

gaplima · December 2015

To remove the mouse over in "Clients" use the same procedure mentioned above?

http://bipharma.com.br/novo/convenios/

Thanks for advance

Albert · December 2015

@gaplima To remove hover effect from clients, please use below css:

ul.clients .client_wrapper:hover { background: none !important; }

jimosulli · December 2015

Just a quick note FYI:

.image_frame .image_wrapper .mask { display: none; }
.image_frame .image_wrapper .image_links { display: none; }
.image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }

No longer works. I had to edit shortcodes.css to remove the hover images/links

Albert · December 2015

What exactly no longer works? And where? Please give us more details about what you mean.

sparcohu · March 2016

"

.image_frame .image_wrapper .mask { display: none; }
.image_frame .image_wrapper .image_links { display: none; }
.image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }

No longer works. I had to edit shortcodes.css to remove the hover images/links"

I have to agree, no longer works. 
I use these CSS codes, but still problem with linked iamges, like this:
http://kepfeltoltes.hu/160316/keplink_www.kepfeltoltes.hu_.png

sparcohu · March 2016

OK, now it works with this:

.something img{
padding-bottom:15px;
}

Albert · March 2016

Great, we are glad you found the css you were looking for!

T0ni · October 2016

How do I disable the hovereffect on woocommerce product images?

I use a betheme childtheme, updated

which file? Where is it located, which line of code?

Thanks

Albert · October 2016

@T0ni In reference to Item Support Policy files customization is not allowed. And if you want to modify files and don't know how, you should contact with your web developer. The only way we can help you is give you custom css to remove this effect but we would be able to give you more details only if you will send us link to page where you got these product images.

Uniquegfx · January 2017

Wait... How do I remove the effect? I see the code above but where do I place it... Please Help!

Thanks

Albert · January 2017

@Uniquegfx Above you have css code and like any other css, it need to be put under Theme options > Custom CSS & JS > Custom CSS section. But if you want to modify theme files, then you need to contact with your web developer.

Biobizz · March 2018

Hello team Muffingroup,

I have also tried to remove the move over effect on the blog items with the following code but it doesn't seem to work.

.image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: 0px; }

Thanks in advance!

Bryan · March 2018

Biobizz
Hey, you can change the hover effect in theme options>global>general under the image frame style.
thanks

addoctorfoo · June 2020

Hi Guys, I'm trying to remove the underline in my links to portfolio items from a page.

Here's the URL:
https://piriurdi.es/work/

Can you guys help me?

Thanks!

Pablo · June 2020

addoctorfoo,

You can change that behavior, on the same location as on the screenshot:

https://prnt.sc/t63gqx

Thanks

kainer · October 2020

Is it possible instead of the hovering effect to have a real button under the image? In our shop it is not obvious that you can click on the image ion mobile specifically.

"Show Cart button on archives" is "on" but does not change anything.

Pablo · October 2020

kainer,
Please always attach a link so we can check it out. If the page is offline(localhost) then our help will be limited, you will have to contact us when the page is online. Also please make sure that the page is not under maintenance before you provide us the link.
It is always a good idea to also attach a screenshot, for that use services like snag.gy or pasteboard.co
thanks

Remove mouse over effect on portfolio items [hover effect on portfolio items]

Comments

This website uses cookies