Owl-轮播过渡后退

Question

我正在尝试通过以下代码添加 Owl Carousel 的后退动画。但是倒退动画没有添加到我的模板中。试了很多方法，还是想不通

demo

Answer 1

我注意到您使用的 owl.carousel v2.3.4 和 owl.transitions.css v1.3.2 不兼容。将 owl.carousel 降级到 v1.3.3 应该有助于解决问题

Answer 2

由于您正在使用 owl.carousel v2.3.4 动画由 animateIn 和 animateOut 属性 - reference 管理。您只需要使用 owl.transition.css 文件中的适当 CSS 类。下面的示例应该有效。

$(".owl-carousel").owlCarousel({
        slideSpeed : 1000,
        paginationSpeed : 500,
        singleItem:true,
        items: 1,
        navigation : false,
        animateIn:"owl-backSlide-in",
        animateOut: "owl-backSlide-out",
        afterAction:function(){$(window).trigger("resize");},
    });