Kushal Shah
Kushal Shah

Reputation: 447

Owl carousel 2 animate not working in chrome latest version (V52)

I am using owl carousel version 2.0.0 with animate.css for fadein and fadeout effect and its not working on chrome latest version 52.0.2743.116

Below is the script that I used for fade items.

$('.owl-carousel').owlCarousel({    
    //loop:true,
    margin:10,
    nav:true,
    items:1,    
    animateIn: 'fadeIn',
    animateOut: 'fadeOut',
    mouseDrag: false,
   touchDrag: false,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:1
        },
        1000:{
            items:1
        }
    }
})

Any help will be appreciated.

Upvotes: 0

Views: 2800

Answers (1)

Kushal Shah
Kushal Shah

Reputation: 447

For this you need to add below css.

.owl-carousel .owl-wrapper-outer{
       overflow: hidden;
       position: relative;
       width: 100%;
       z-index: 1;  // added this
}
.owl-item { 
     transform: translateZ(0);
     -webkit-transform: translateZ(0); 
     -ms-transform: translateZ(0);
 }

It works for me.

Upvotes: 1

Related Questions