owl carousel 2 fade effect not working
Owl animate functions only work on "single item" carousels (only shows one slide at a time):
"Animate functions work only with one item and only in browsers that support perspective property."
see here: http://owlcarousel2.github.io/OwlCarousel2/demos/animate.html
here is one of my current slider implementations using the fadeIn and fadeOut accordingly, and by all accounts your code looks correct for the core owl and this works well.
$('.index-gallery .owlcarousel').owlCarousel({
themeClass: 'owl-fullscreen owl-nonav white owl-loaded',
autoplay:true,
autoplayTimeout: 4000,
items:1, // items to display in slider
//margin:0, // margin(px) on item.
//LOOP? - IF ONLY ONE SLIDE SEE: https://github.com/smashingboxes/OwlCarousel2/issues/548
loop:true, // Inifnity loop. Duplicate last and first items to get loop illusion.
navRewind:true, // Go to first/last.
nav:true, // left and right arrows
autoHeight: true,
navContainerClass: 'owl-buttons',
dotsClass: 'owl-pagination',
dotClass: 'owl-page',
animateOut: 'fadeOut',
animateIn: 'fadeIn',
autoplayHoverPause:true, //false
lazyLoad: false, // IMG need special markup class="lazyOwl" and data-src="url_to_img" or/and data-src-retina="url_to_highres_img"
dots:false // true
});
you may wish to see this thread for further advice / solutions / ideas:
Owl Carousel fade effect not working
Comments
-
sunilkjt almost 2 years
Iam currently trying to use owl carousel 2 with fade effect but it shows default swipe effects insted.How can I fix it.
Here,s my code
function owlWrapperWidth( selector ) { $(selector).each(function(){ $(this).find('.owl-carousel').outerWidth( $(this).closest( selector ).innerWidth() ); }); } owlWrapperWidth( '.owl-wrapper' ); $( window ).resize(function() { owlWrapperWidth( $('.owl-wrapper') ); });
$('.owl-carousel').owlCarousel({ animateOut: 'fadeOut',
animateIn: 'fadeIn', nav:true, loop: true, responsive: { 0: { items: 1 }, 600: { items: 2 }, 1000: { items: 3, slideBy:3, } } });
I have added animateIn:'fadeIn' but no success at all
Thanks