如何在主要猫头鹰包装外移动.owl-pagination？ OwlCarousel2

Question

如果有一种简单的方法可以将.owl-pagination移动到主要猫头鹰包装外的另一个div，那将会很棒。想知道是否有直接的方法来实现这一目标？

Answer 1

适用于标准选项： navContainer 和 dotsContainer

HTML

<!-- html custom containers -->
<div id="customNav" class="owl-nav"></div>
<div id="customDots" class="owl-dots"></div>

的javascript

$('#owl-carousel').owlCarousel({
    // move navContainer outside the primary owl wrapper
    navContainer: '#customNav',
    // move dotsContainer outside the primary owl wrapper
    dotsContainer: '#customDots',

   // other OwlCarousel2 options
})

对于OwlCarousel2问题663，Full screen result in JsFiddle

Answer 2

您可以在init之后移动导航，如下例所示： http://owlgraphic.com/owlcarousel/demos/navOnTop2.html

$(document).ready(function() {

  $("#owl-demo").owlCarousel({
    navigation:true,
    afterInit : function(elem){
      var that = this
      that.owlControls.prependTo(elem)
    }
  });

});