0

I am trying to implement owl carousel that updates it's center option using a call back.

$('.owl-carousel').owlCarousel({
    center: callback
});
function callback() { 
    if ( $('.owl-item .item').length == 1 ){
        return true; 
    }
    return false;

The owl item length is correct. But it's not updating the center options. Is there any better correct to do this.

anjo
  • 315
  • 2
  • 7
  • 18

1 Answers1

1

Owlcarousel center option is only expecting for true or false, boolean callback will work, but remove the event parameter.

$('.owl-carousel').owlCarousel({
        loop: true,
        margin: 10,
        center: function() {
          if ($('.owl-item .item').length == 1) {
            return true;
          }
          return false;
        },
      });

Do it like this :

jQuery(document).ready(function($) {
  $('.loop2').owlCarousel({
    loop: true,
    margin: 10,
    center: function() {
      if ($('.owl-item .item').length == 1) {
        return true;
      }
      return false;
    },
  });

});
<link href="http://www.owlcarousel.owlgraphic.com/assets/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet" />

<link href="http://www.owlcarousel.owlgraphic.com/assets/owlcarousel/assets/owl.theme.default.min.css" rel="stylesheet" />
<link href="http://www.owlcarousel.owlgraphic.com/assets/css/docs.theme.min.css" rel="stylesheet" />

<script src="http://www.owlcarousel.owlgraphic.com/assets/vendors/jquery.min.js"></script>
<script src="http://www.owlcarousel.owlgraphic.com/assets/owlcarousel/owl.carousel.js"></script>

<div id="demos">


  <div class="loop2 owl-carousel">
    <div class="item">
      <h4>1</h4>
    </div>
  </div>

</div>
Ralph John Galindo
  • 1,190
  • 6
  • 11
  • 1
    Issue not solved. The call back function is always returning **true** value. – anjo Feb 24 '16 at 06:08
  • that is your code that you gave me. you didnt include in the question what are the conditions that you need when you want it centered or not. i just showed you how you should use the callback. – Ralph John Galindo Feb 24 '16 at 09:58
  • I tried your code but is not working. You need to execute the function like `center : (function () { return false; })(),` – R3tep Mar 29 '17 at 07:59