-
Posts
-
I feel like i’m asking a bunch of questions haha i’ve looked throught the forum and tried some codes but none seem to work for me. Is there a quick css code for disabling the hover gradient and arrow on linked images? example: http://www.nvltygoods.com/shop/ Id like to disable both and instead add a thin white border when hovered over. Any help would be great!
Hey nvltygoods!
Please add following code to Quick CSS in Enfold theme options under Styling tab
.image-overlay { display: none!important; } .avia_image.avia-align-center:hover { border: white solid 1px; }Regards,
YigitNM i added it to the top but there are some options that are showing up that i have hid before. Is there a correct order in which i should apply my quick css codes so they all work properly?
sorry,…. also im not a fan of the image resizing once hovered over. it shrinks just a hair smaller when hovered.
Hi!
It’s caused by the border which triggers a 2px shift of the image when you hover over the product. You can fix it by removing the “white border hover effect” or by adding a dark border to the product if the user does not hover over the product. You can use follow code
.avia_image.avia-align-center { border: #222 solid 1px; }to add a dark border to the product image links.
Best regards,
Peter
- The topic ‘Disable image hover effect and add border instead’ is closed to new replies.