Tagged: , ,

Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
    Posts
  • #1053477

    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!

    • This topic was modified 5 years, 9 months ago by c_srishti.
    #1053751

    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,
    Victoria

    #1053856

    Hello 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
    Srishti

    #1054756

    Hi,

    I hovered all of the images and I couldnt see any problem, are u sure?

    Best regards,
    Basilis

    #1054781

    Hi 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.
    arrow

    Also is it possible to have a drop shadow around the images?
    thanks a lot
    srishti

    http://fv6.97e.myftpupload.com/wp-content/uploads/arrow.jpg

    • This reply was modified 5 years, 9 months ago by c_srishti.
    #1056939

    Hi,

    Please add the following CSS:

    .image-overlay .image-overlay-inside { visibility: none; }

    Let us know if it works out for you :)

    Best regards,
    Basilis

    #1056954

    Hi 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…

    • This reply was modified 5 years, 9 months ago by c_srishti.
    #1057550

    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,
    Ismael

    #1057948

    Hello 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!

    • This reply was modified 5 years, 9 months ago by c_srishti.
    #1058504

    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,
    Ismael

    #1058947

    That 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!
    Srishti

    #1059412

    Any tips on this? Would really appreciate!

    #1059531

    Hi,

    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,
    Ismael

    #1059767

    Hello 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?

    #1060393

    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,
    Ismael

    #1060600

    Please 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!

    #1060966

    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,
    Ismael

    #1061258

    Hello 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!

    #1062251

    Hi c_srishti,

    Which browser are you using?

    Try using ctrl+f5.

    Best regards,
    Victoria

Viewing 19 posts - 1 through 19 (of 19 total)
  • You must be logged in to reply to this topic.