Tagged: 

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • #368854

    Hey,

    Could you tell me how to remove the image hoverlay effect in ‘avia.js’? I’ve tried to comment out the block of code, as per this thread, but it’s creating an error and all javascript elements on the site fail.

    Thanks, Graeme

    #368939

    Hi Iano999!

    Please find following code in Avia.js file and remove it – http://pastebin.com/Y6yQgBQ5
    You can find it by searching “hover effect for images”

    Regards,
    Yigit

    #368965

    Hi Yigit,

    Like I mentioned in my original post, removing that block creates an error, causing elements such as the ‘scroll-top-link’ box to fail. I’ve tried both deleting and commenting out the section, and I’m 100% certain I’m only selecting code that relates to the image hover effect, so cannot understand why this is causing an issue with other elements.

    My ‘avia.js’ file is as follows: http://pastebin.com/xseFvC7d

    • This reply was modified 10 years ago by Iano999.
    #369888

    Hi guys,

    Sorry, I really need to resolve this, as it’s going to hold up out launch if it’s not fixed today. Is there any other way of disabling this effect? Trying to hide it by changing CSS hasn’t worked, as it creates spacing below images on hover – I need to be able to remove the js without breaking other js elements on the site.

    #369983

    Hi!

    Have you tried adding following code to Quick CSS in Enfold theme options under General Styling tab

    .image-overlay { display: none !important; }

    It should not cause a spacing

    Regards,
    Yigit

    #370046

    Hi Yigit,

    Thanks for your reply. Yeah, I’ve already got that in my CSS – the spacing is created on hover, but there’s no visible transition/opacity change. The images are links to another page, if that makes a difference to the CSS required?

    #370051

    Hey!

    Can you please post the link to your website and point out the images? Just to make sure that we are on the same page, this is the overlay you would like to remove – http://i.imgur.com/Khsyb78.png is that correct?

    Regards,
    Yigit

    #370058
    This reply has been marked as private.
    #370070

    Hey!

    Can you please try de-activating all active plugins and check if that helps?

    Regards,
    Yigit

    #370085

    Hey Yigit,

    I had tried that previously, but just deactivated all plugins again and the issue still persisted. Is there any reason you know of that would cause a problem with the avia.js file when I delete the block of code for the overlay? I know that removing the code fixes the problem from testing, but I can’t delete it at the expense of all other js elements on the site.

    Thanks,
    Graeme

    #370101

    Hi!

    Can you please try adding following code to Style.css file of your child theme in Appearance > Editor

    .col.span_1_of_2.card.products > a {
    display: compact!important;
    }

    I cannot edit the file because of permissions

    Regards,
    Yigit

    #370108

    Hey Yigit,

    Sorry, that doesn’t seem to have any impact. I’ve tried a couple of variations to select the image within the link too, and it’s still creating the space below on hover.

    #370185

    Hey!

    Can you please make Style.css file writable so we can add custom CSS codes? Currently code i add to Quick CSS field is not being applied

    Regards,
    Yigit

    #370510

    Hi Yigit – I don’t think I’ll be able to do that because we have a strict firewall, and to edit files you need your ip whitelisted. When I’ve looked at the site this morning, the links below the images seem to be broken (http://cl.ly/Z2jS) – is this something you’ve changed?

    Graeme

    #371793

    Hi Graeme!

    Sorry for the late reply!
    No, i have only added custom CSS code which did not apply. There is a line break between A tags as you can see here – http://i.imgur.com/eQ0EmRE.png
    Please remove those breaks. I removed from the first item on your Products page and it seemed to work fine. Please review your website

    Best regards,
    Yigit

    #374998

    Hi Yigit,

    Upon closer inspection, it seems that whenever I comment out the Image Overlay block in ‘avia.js’ it causes an issue with the Smooth Scrolling block directly below for anchor links, causing them to fail on the site. Can you test on your end and let me know how to comment out the Image Overlay section without causing an issue in the rest of the file?

    Thanks, Graeme

    #376215

    Hi guys,

    I’m still waiting to hear how I can fix this issue – if anyone has the solution I’d massively appreciate it.

    Thanks, Graeme

    #376792

    Hey!

    Sorry for the late reply Graeme. Please add following code to Style.css file of your child theme

    .col.span_1_of_2.card.products > a + br {
    display: none!important;
    }

    That seems to be fixing the issue on my end

    Cheers!
    Yigit

    #377317

    Awesome, thank Yigit – that’s perfect. Thanks for your help, I really appreciate it!

    Have a great weekend,
    Graeme

    #377332

    Hi!

    You are welcome Graeme, we are always happy to help! You too have a great weekend :)

    Cheers!
    Yigit

Viewing 20 posts - 1 through 20 (of 20 total)
  • The topic ‘Remove image hover effect’ is closed to new replies.