Tagged: 

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    Posts
  • December 16, 2014 at 12:12 pm #368854
    Iano999

    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

    December 16, 2014 at 4:02 pm #368939
    Yigit

    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

    December 16, 2014 at 4:48 pm #368965
    Iano999

    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 9 years, 11 months ago by Iano999.
    December 18, 2014 at 10:26 am #369888
    Iano999

    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.

    December 18, 2014 at 3:45 pm #369983
    Yigit

    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

    December 18, 2014 at 4:52 pm #370046
    Iano999

    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?

    December 18, 2014 at 4:57 pm #370051
    Yigit

    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

    December 18, 2014 at 5:09 pm #370058
    Iano999
    This reply has been marked as private.
    December 18, 2014 at 5:19 pm #370070
    Yigit

    Hey!

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

    Regards,
    Yigit

    December 18, 2014 at 5:31 pm #370085
    Iano999

    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

    December 18, 2014 at 5:44 pm #370101
    Yigit

    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

    December 18, 2014 at 5:48 pm #370108
    Iano999

    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.

    December 18, 2014 at 8:31 pm #370185
    Yigit

    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

    December 19, 2014 at 11:47 am #370510
    Iano999

    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

    December 22, 2014 at 9:13 pm #371793
    Yigit

    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

    January 5, 2015 at 12:28 pm #374998
    Iano999

    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

    January 7, 2015 at 4:04 pm #376215
    Iano999

    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

    January 8, 2015 at 3:41 pm #376792
    Yigit

    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

    January 9, 2015 at 12:07 pm #377317
    Iano999

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

    Have a great weekend,
    Graeme

    January 9, 2015 at 1:13 pm #377332
    Yigit

    Hi!

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

    Cheers!
    Yigit

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