📜  owl-carousel 仅适用于移动设备 - 任何代码示例

📅  最后修改于: 2022-03-11 14:59:05.637000             🧑  作者: Mango

代码示例1
/*
And a bit of CSS to show disabled Owl element:

.owl-carousel.off {
    display: block;
}
*/

$(function() {
    var owl = $('.owl-carousel'),

        owlOptions = {
          loop: false,
                margin: 30,
                smartSpeed: 700,
                nav: false,
                items: 1
        };

    if ( $(window).width() < 768 ) {
        var owlActive = owl.owlCarousel(owlOptions);
    } else {
        owl.addClass('off');
    }

    $(window).resize(function() {
        if ( $(window).width() < 768 ) {
            if ( $('.owl-carousel').hasClass('off') ) {
                var owlActive = owl.owlCarousel(owlOptions);
                owl.removeClass('off');
            }
        } else {
            if ( !$('.owl-carousel').hasClass('off') ) {
                owl.addClass('off').trigger('destroy.owl.carousel');
                owl.find('.owl-stage-outer').children(':eq(0)').unwrap();
            }
        }
    });
});