p OwlCaruisel 2 Jquery — Данил Самигуллин
+7 982 100 5 999

OwlCaruisel 2 Jquery

Просто вывод слайдов с адаптивом

(function(){
    $(document).ready(function(){
        var owl = $('.sertificats_block');
        owl.owlCarousel({
            loop: true,
            items: 4,
            margin: 18,
            smartSpeed: 600,
            autoplay: true,
            responsiveClass: true,
            responsive: {
                0: {
                    items: 2,
                    margin: 10,
                },
                600: {
                    items: 3,
                },
                1000: {
                    items: 5,
                }
            }
        });
    });
})();

Кастомные nav и dots

<div class="nav-slide">
    <div class="slide-arrow prev"></div>
    <ul class="thumbs">
        <li class="thumb active"><span>01</span></li>
        <li class="thumb"><span>02</span></li>
        <li class="thumb"><span>03</span></li>
    </ul>
    <div class="slide-arrow next"></div>
</div>
(function(){
    $(document).ready(function(){
        var owl = $('.slider-two_block');
        owl.owlCarousel({
            loop: true,
            items: 1,
            smartSpeed: 600,
            dots: true,
            dotsData: true,
            dotsContainer: '.slider-two .nav-slide .thumbs',
        });
        $('.slider-two .next').click(function () {
            owl.trigger('next.owl.carousel');
        });
        $('.slider-two .prev').click(function () {
            owl.trigger('prev.owl.carousel');
        });
        $('.slider-two .thumb').click(function () {
            owl.trigger('to.owl.carousel', [$(this).index(), 300]);
            $('.thumb').removeClass('active');
            $(this).addClass('active');
        });
    });
})();