Search code examples
javascriptjquerysliderowl-carousel

Owl Carousel Filter


Greetings to everyone.

First of all, I would like to point out that our English is not very good. I filtered with owl carousel. I found the codes on the internet. I edited it a bit and it's working now. But what I want is to be animated while filtering. animation can fadeOut. but I couldn't do it. Thank you very much in advance if anyone can help.

Project Link;

https://codepen.io/-kr-Esen-the-typescripter/pen/zYewrJQ

I tried animated filtering with owl carousel but it didn't work. If it can be done using another carousel, I can use that too I tried animated filtering with the owl carousel but it didn't work. If it can be done using another carousel, I can use that too


Solution

  • I'm not sure what element you want to animate, but I think that you want to animate the h2s. If so, add the following CSS to your code:

    .owl-item h2 {
        opacity: 0;
    }
    .owl-item.active h2 {
        opacity: 1 !important;
    }