Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • May 12, 2015 at 2:46 pm #443022
    tomek_z

    Hi, I am wondering if it is possible to change hover effect. As a default it gets shadow with an icon.
    I would like to see the picture changing to B&W.
    The oposite solution as an example I found on luxurytravel.is/ where is a set of B&W images. On hover they get coloured and have some description field instead of icon.

    Kind regards
    Tomasz

    May 14, 2015 at 2:11 pm #444275
    Ismael

    Hi tomek_z!

    Thank you for using Enfold.

    The black and white hover effect is possible but the hover content will require custom modification that is outside the scope of support. Please give us a link to the posts page.

    Best regards,
    Ismael

    May 14, 2015 at 6:43 pm #444522
    tomek_z
    This reply has been marked as private.
    May 14, 2015 at 6:50 pm #444525
    Yigit

    Hey!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    #top .avia-gallery .avia-gallery-thumb a { filter: grayscale(100%);
    -webkit-filter: grayscale(100%); 
-moz-filter: grayscale(100%); 
-o-filter: grayscale(100%); 
    filter: gray;
    -webkit-transition: all .6s ease;
transition: all .6s ease;
-moz-transition: all .6s ease;
-o-transition: all .6s ease; }

#top .avia-gallery .avia-gallery-thumb a:hover {    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
    filter: none; }

#top .avia-gallery .avia-gallery-thumb a:hover {
  opacity: 1;
}

    Unfortunately not. Please hire a freelance developer for such feature or request it here – https://kriesi.at/support/enfold-feature-requests/

    Best regards,
    Yigit

    August 4, 2015 at 1:14 am #482462
    tomek_z

    Hi,
    This was great!
    I am wondering how to get the same effect on Media Element / Gallery
    1. get rid of shading of the picture
    2. get grey scale picture which get colour on hover.
    Kind regards
    Tomasz

    August 4, 2015 at 5:12 pm #482836
    Yigit

    Hey!

    Can you please post the link to your page and point out the element ?

    Cheers!
    Yigit

    August 4, 2015 at 6:23 pm #482889
    tomek_z

    Hi,
    Here is the link for the working site.
    http://hurtowniarolnicza.migrola.com.pl/kruszywa-ozdobne/zwiry/
    I marked this with the comment in red on the page.
    Kind regards.
    T

    August 4, 2015 at 7:15 pm #482910
    Yigit

    Hey T!

    Please add following code to Quick CSS

    #top .avia-gallery .avia-gallery-thumb a:hover {
    opacity: 1;
}
#top #wrap_all .avia-gallery .avia-gallery-thumb a:hover {
    filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: none;
}
#top #wrap_all .avia-gallery .avia-gallery-thumb a {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: gray;
    -webkit-transition: all .6s ease;
    transition: all .6s ease;
    -moz-transition: all .6s ease;
    -o-transition: all .6s ease;
}

    Cheers!
    Yigit

    August 4, 2015 at 8:44 pm #482959
    tomek_z

    Great!
    This is exactly what I wanted.
    Thank you again.
    Tomasz

    August 5, 2015 at 10:04 am #483178
    Rikard

    Hi,

    Great, glad we could help :-)

    Best regards,
    Rikard

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Posts galery Black&white pictures on hover’ is closed to new replies.