Reputation: 447
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
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