-
Posts
-
Hello,
When adding an image to the page via the media elements and adding a link to it, I want my image to get slightly larger on hover but I don’t want the big arrow animation that shows up on top of the image….
How can I remove that?
Thank you!
Srishti
PS: Though I have the option set for “slightly larger on hover, it is not changing on hover, just the big arrow shows on top of the image!
PPS: When I select the image to show caption or then the big arrow does not show up, when I turn the image to have a link then the images do not zoom.
I would like the images to zoom on hover and not have the big arrow coming up on the hover…
Thanks!Hey c_srishti,
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
VictoriaHello Victoria,
My website is here:You will see that out of the 4 images, the last one has the big arrow when you hover on it.
thanks
SrishtiHi Basilis,
It is not a problem, I would just link to not see the big arrow that shows up when you hover over an image that has a link.
Also is it possible to have a drop shadow around the images?
thanks a lot
srishtiHi,
Please add the following CSS:
.image-overlay .image-overlay-inside { visibility: none; }
Let us know if it works out for you :)
Best regards,
BasilisHi Basilis,
I am sorry, that did not work :( I did a hard refresh but still showing the big arrow.
I would like it to show the image zoom when it is a link, otherwise nothing fancy should happen, And I would like to get rid of the big arrow.
my login details below…Hi,
Thanks for the update. Set the visibility property value from “none” to “hidden”. Or just set the “display” property to “none”.
.image-overlay .image-overlay-inside { visibility: hidden; }OR
.image-overlay .image-overlay-inside { display: none !important; }Best regards,
IsmaelHello Ismael,
The css is still not working properly.
When I apply any of the above suggestions, the arrow goes away but a semi-transparent white glaze goes over the image. I would just like the image to do the zoom on hover when it is a link. and no overlay at all..
Please take a look at the website,
thank you!Hi,
You can use this one if you want to remove the overlay completely.
.avia-image-overlay-wrap a.avia_image .image-overlay { display: none !important; }Best regards,
IsmaelThat worked great! thank you!
What do I do to get rig of the graphic and the overlay that comes up when there is going to be a lightbox coming up…
Examples on all the images this page:
http://fv6.97e.myftpupload.com/blog/awaiting-the-storm/Thanks!
SrishtiHi,
Are you referring to the dark overlay? Try this css code.
.mfp-zoom-in.mfp-ready.mfp-bg, .mfp-zoom-in.mfp-ready .mfp-preloader { display: none !important; }Best regards,
IsmaelHello Ismael,
thanks for your reply! No that didn’t do it….
I am talking about : when I hover over the images which are going to open in light box, there is an arrow graphic and a white semi-transparent overlay.
Perhaps it would be ok to have the white overlay, but how to get rid of the arrow graphic?Hi,
The previous css code should have removed that overlay and arrow. Did you add the previous css code?
.avia-image-overlay-wrap a.avia_image .image-overlay { display: none !important; }Please provide a screenshot of the “white overlay or the arrow”.
Best regards,
IsmaelPlease find a screenshot here:
http://fv6.97e.myftpupload.com/wp-content/uploads/arrow.png
No the above css only worked on the home page…
I would like some assistance with this fast.
Thanks!Hi,
Thanks for the info.
This should remove every image overlay in the site including the ones in the blog page.
.image-overlay { display: none !important; }Best regards,
IsmaelHello Ismael,
That did not do it, I did a flush cache and hard reload.. but still the same result.
I already had this code
.avia-image-overlay-wrap a.avia_image .image-overlay {
display: none !important;
}I am still getting the overlay in the blog page….
Any other suggestions please!
- You must be logged in to reply to this topic.