ustawienia Owlcarousel 2 zmieni się po init,

Question

mam już

var owl = $(".owl-carousel").owlCarousel({loop: true, nav: true}); 

staram zmień ustawienia pętli lub opcji nav ale nie działa

owl.data('owl.carousel').settings.loop = false; 
owl.data('owl.carousel').settings.nav = false; 

jak to zrobić dzięki.

Answer 1

udało mi się go rozwiązać z

owl.data('owl.carousel').options.loop = false; 

owl.data('owl.carousel').options.nav = false; 

Answer 2

Powinieneś tego spróbować.

$(".owl-carousel").owlCarousel({ 
       autoplay: true, 
       autoplayTimeout:2000, 
       autoplayHoverPause:true, 
       loop: true, 
       margin: 10, 
       responsiveClass: true, 
       navText : ["<i class='fa fa-chevron-left' aria-hidden='true'></i>","<i class='fa fa-chevron-right' aria-hidden='true'></i>"],// If you want to change next and previous text to font-awesome icon. 
       responsive: { 
        0:{ 
         items: 1, 
         nav: false, 
         dots: true, 
         margin: 0 
        }, 
        600:{ 
         items: 2, 
         nav: false, 
         dots: true, 
         margin: 25 
        }, 
        768: { 
         items: 3, 
         nav: false, 
         dots: true, 
         margin: 25 
        } 
       } 
      }); 

$(".owl-carousel").owlCarousel({ 
 
       autoplay: true, 
 
       autoplayTimeout:2000, 
 
       autoplayHoverPause:true, 
 
       loop: true, 
 
       margin: 10, 
 
       responsiveClass: true, 
 
       navText : ["<i class='fa fa-chevron-left' aria-hidden='true'></i>","<i class='fa fa-chevron-right' aria-hidden='true'></i>"], 
 
       responsive: { 
 
        0:{ 
 
         items: 1, 
 
         nav: false, 
 
         dots: true, 
 
         margin: 0 
 
        }, 
 
        600:{ 
 
         items: 2, 
 
         nav: false, 
 
         dots: true, 
 
         margin: 25 
 
        }, 
 
        768: { 
 
         items: 3, 
 
         nav: false, 
 
         dots: true, 
 
         margin: 25 
 
        } 
 
       } 
 
      });

.owl-carousel 
 
{ 
 
    margin-bottom: 80px; 
 
} 
 

 
.owl-carousel .owl-dots 
 
{ 
 
    position: absolute; 
 
    bottom: -80px; 
 

 
    display: -webkit-box; 
 
    display: -ms-flexbox; 
 
    display: flex; 
 
     flex-direction: row; 
 

 
    width: 100%; 
 

 
    -webkit-box-align: center; 
 
    -ms-flex-align: center; 
 
    align-items: center; 
 
    -webkit-box-orient: horizontal; 
 
    -webkit-box-direction: normal; 
 
    -ms-flex-direction: row; 
 
    -webkit-box-pack: center; 
 
    -ms-flex-pack: center; 
 
    justify-content: center; 
 
} 
 

 
.owl-carousel .owl-dots .owl-dot 
 
{ 
 
    display: -webkit-inline-box; 
 
    display: -ms-inline-flexbox; 
 
    display: inline-flex; 
 

 
    width: 10px; 
 
    height: 10px; 
 

 
    border-radius: 50%; 
 
    background-color: white; 
 
} 
 

 
.owl-carousel .owl-dots .owl-dot.active 
 
{ 
 
    background-color: #0199d6; 
 
} 
 

 
.owl-carousel .owl-dots .owl-dot:not(:last-child) 
 
{ 
 
    margin-right: .75rem; 
 
} 
 
/* Testimonial card */ 
 
.testimonial-card 
 
{ 
 
    margin-bottom: 1.875rem; 
 
    padding: 1.25rem; 
 

 
    border: 1px solid #d8d8d8; 
 
    background-color: white; 
 
} 
 

 
.testimonial-card h4 
 
{ 
 
    font-family: 'Rubik', sans-serif; 
 
    font-size: 1.25rem; 
 
    font-weight: 400; 
 

 
    margin-top: 0; 
 
    margin-bottom: .75rem; 
 

 
    color: #222; 
 
} 
 

 
.testimonial-card span 
 
{ 
 
    font-family: 'Rubik', sans-serif; 
 
    font-size: .9375rem; 
 
    font-weight: 300; 
 

 
    display: block; 
 

 
    margin-bottom: 2.5rem; 
 

 
    color: #0199d6; 
 
} 
 

 
.testimonial-card p 
 
{ 
 
    font-family: 'Open Sans', sans-serif; 
 
    font-size: 13px; 
 
    font-weight: 400; 
 
    font-style: italic; 
 
    line-height: 1.4; 
 

 
    margin-bottom: 0; 
 
}

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400|Rubik:300,400" /> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/owl.carousel.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.carousel.min.css" /> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.2.1/assets/owl.theme.default.min.css" /> 
 
<div class="owl-carousel"> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
            <div class="item"> 
 
             <div class="testimonial-card"> 
 
              <h4>Wilson Edwards</h4> 
 
              <span>Developer</span> 
 
              <p>"We love the approachable format, and the fact that they chose to feature cuomers that users can really relate to."</p> 
 
             </div><!-- Testimonial card --> 
 
            </div> 
 
           </div><!-- Owl Carousel -->

Answer 3

Dla Sowa Carousel 2 try odświeżania karuzeli po opcji Zmiana

$('.owl-carousel').data('owl.carousel').options.nav = false; 
$('.owl-carousel').trigger('refresh.owl.carousel');