Breaking News: Grepper is joining You.com. Read the official announcement!

owl-carousel only for mobile

Adventurous Ant answered on July 5, 2021 Popularity 8/10 Helpfulness 5/10

answer owl-carousel only for mobile

owl-carousel only for mobile

Comment

/*
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();
            }
        }
    });
});

Popularity 8/10 Helpfulness 5/10 Language javascript

Source: gist.githubusercontent.com

Tags: javascript mobile owl-carousel

Link to this answer
Share Copy Link

Contributed on Jul 05 2021

Adventurous Ant

0 Answers Avg Quality 2/10

owl-carousel only for mobile

Contents

More Related Answers

owl-carousel only for mobile

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.