Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • August 28, 2016 at 6:11 am #678567
    bibahbuh

    Hello,

    What CSS do I need to add for the hover on my masonry grid? I would like a red color for example, instead of the opacity and to keep the originally zoom effect as well.
    ( Example of hover color (just the color, I don’t the text): http://peacheyphotography.co.uk/)

    I’m at this point in my CSS research:

    .avia_desktop .av-masonry-entry:hover .av-masonry-image-container {
    -webkit-transform: none;
    -moz-transform: none;
    transform: none;
    opacity: 0.5!important;
    }

    Thanks a lot for your help.
    Regards,
    Bibahbuh

    August 29, 2016 at 8:53 am #678773
    Vinay

    Hey bibahbuh,

    please remove the code that is added earlier and try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    .av-inner-masonry:hover {
	background-color:#ff0000!important;
	opacity:.95!important;
}

    Best regards,
    Vinay

    August 30, 2016 at 3:58 am #679238
    bibahbuh

    Hello Vinay,

    Thanks a lot for your reply.
    It’s exactly what I wanted :)

    Only one thing: when I ‘m changing the background color (I tried red, yellow, bleu…) the result is always in grayscale when I hover the pictures.
    Could you help me again to solve this.

    Thanks a lot.
    Best regards,

    Bibahbuh

    August 30, 2016 at 11:14 am #679328
    Vinay

    Hi,

    I have altered the code and added the below code

    .av-masonry-image-container:hover, .av-inner-masonry:hover {
     background-color:red!important;
     opacity:.95!important;
}
.av-masonry-image-container {
margin-right:2px;
margin-bottom:2px;
}

    Please review the site now :)

    Best regards,
    Vinay

    September 13, 2016 at 7:19 am #685533
    bibahbuh

    Hi Vinay,

    Sorry for my late response.
    Thanks for your help. It works perfectly :)
    It’s perfect for my screen resolution (1280×1024) but not for my client screen (more than large desktop)… I will try to find a way.

    Thanks a lot.
    Have a nice day.

    Bibahbuh

    September 14, 2016 at 7:23 am #686171
    Rikard

    Hi,

    Ok, let us know if you should need any more help on the topic.

    Regards,
    Rikard

    September 15, 2016 at 7:58 am #686770
    bibahbuh

    Hi Rikard,

    Thanks for your message.
    Everything is all good now :)
    I just had to create a .png for my pictures instead a .jpg!!
    Everything works perfectly.

    Thanks a lot.

    Regards,
    Bibahbuh

    September 16, 2016 at 4:48 am #687186
    Vinay

    Hi,

    Glad we could help!
    We really appreciate it if you rate our theme on themeforest .
    To know more about enfold features please check – http://kriesi.at/documentation/enfold/
    Thank you for using Enfold :)

    Best regards,
    Vinay

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Masonry Hover’ is closed to new replies.