<div id="started-carousel">
      <div id="started-panel-01">1</div>
      <div id="started-panel-02">2</div>
      <div id="started-panel-03">3</div>
      <div id="started-panel-04">4</div>
</div>
<div id="started-carousel-nav" class="flex-container">
      <div class="flex-item">1</div>
      <div class="flex-item">2</div>
      <div class="flex-item">3</div>
      <div class="flex-item">4</div>
</div>

$("#started-carousel").owlCarousel({
        dots: false,
        items: 1,
        itemsDesktop: [1199, 1],
        itemsDesktopSmall: [979, 1],
        itemsTablet: [768, 1],
        itemsMobile: [479, 1],
        singleItem: !0,
        slideSpeed: 700,
        rewindNav: !1,
        touchDrag: !1,
        mouseDrag: !1,
        afterAction: t
    });
    var c = $("#started-carousel").data("owlCarousel");
    $("#started-carousel .next").click(function() {
        c.next()
    });
    var s = $("#started-carousel-nav > .flex-item").click(function() {
        var t = s.index(this);
        //c.goTo(t)
       $("#started-carousel").owlCarousel();
       $("#started-carousel").trigger("to.owl.carousel", [0, 500, true]);
    });