jquery - 当 slider 向左/向右移动时,如何为 owlcarousel 卡制作动画

标签 jquery css owl-carousel

this link here您将看到如下图所示的部分:

enter image description here

我已经设法使用 owlcarowsel 实现了 slider 。 但是,如何添加与链接中的动画相同的动画?

因此,当单击下一个或上一个时,第一个图像首先随着动画移动,然后它们都以您看到的方式滑动动画。

目前,这是我的 jquery 的样子:

$(document).ready(function(){

    var owl = $(".owl-carousel");

    owl.each(function() {

        var items = ( $(this).data('items') ) ? $(this).data('items') : 1;

    $(this).owlCarousel({
        loop: true,
        margin:30,
        stagePadding:30,
        smartSpeed: 400,
        'navText': ['< Prev','Next >'],
        onChange: function() {
            console.info('carousel change');
        },
        onChanged: function() {
            console.info('carousel changed');
        }
        //'margin': '30px',
    });
    })
});

或者是否有另一个插件可以执行与发布的 url 类似的操作?

最佳答案

正如我所见,那些人使用完整的 CSS 转换来制作滚动。 如果你想处理它,请在带有 ID 的单个 DIV 中使用 3 个图像,然后应用 onclick 操作,如旋转木马,以便轻松制作动画。

关于jquery - 当 slider 向左/向右移动时,如何为 owlcarousel 卡制作动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56648683/

相关文章:

jquery - 如何更改点击时的图像和 alt 属性?

javascript - 使用后台 jquery 进行导航

javascript - Jasmine jQuery 测试鼠标回车

javascript - jquery ui draggable 自动改变宽度

javascript - 使用 jquery 通过方法选择 javascript 对象

wordpress - 为二十十二主题添加丝带包装

html - 不能垂直对齐绝对跨度

javascript - Owl-Carousel 过渡回退

javascript - 调整 Owl Carousel 的高度

javascript - Owl Carousel 自定义图像预览分页不起作用