Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #490138

    If i use the code below all images popup in Black&White (hover in color) which is perfect. But i do not want my full-width easy slider popup in black&white.
    How can i aid this?
    THX Freek

    #main img { filter: grayscale(100%);
        -webkit-filter: grayscale(100%); 
        filter: gray;
        -webkit-transition: all .6s ease; }
    
    #main img:hover {    filter: grayscale(0%);
        -webkit-filter: grayscale(0%);
        filter: none; }
    .image-overlay { display: none !important; }
    #490141

    Hey Freek!

    Please turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and give your slider a custom class and then add following code to Quick CSS

    .your-custom-class img { filter: grayscale(0%);
        -webkit-filter: grayscale(0%);
        filter: none;
    }

    Regards,
    Yigit

    #490181

    mmm doe not work. I added this code in function.php
    add_theme_support('avia_template_builder_custom_css');

    I added a Custom css class called freek1 in the slider settings and i added both code (from above) with the right custom-class(freek1).

    Maybe it is possible to do the b/w – color hover only on elements with a custom css class? So not on all images on the site…

    THX Freek

    • This reply was modified 9 years, 4 months ago by Freek.
    #490198

    Hi!

    Please try changing your code to following one

    .your-custom-class img { filter: grayscale(100%);
        -webkit-filter: grayscale(100%); 
        filter: gray;
        -webkit-transition: all .6s ease; }
    
    .your-custom-class img:hover {    filter: grayscale(0%);
        -webkit-filter: grayscale(0%);
        filter: none; }
    .your-custom-class .image-overlay { display: none !important; }

    Regards,
    Yigit

    #490216

    This works great. Thank you for the awesome support!!
    THX Freek

    #490634

    Hey,

    Great, glad we could help :-)

    Regards,
    Rikard

Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘B/W hover images’ is closed to new replies.