简体   繁体   中英

Owl Carousel Speed Won't Change

I'm utilizing the Owl Carousel library for a slider on a partner's page. It's working pretty well except for setting the frequency and speed of the transitions.

I've followed the documentation and have the script, but it doesn't seem to be working properly. Below is the HTML and JS that I'm using. I've also linked to the page here: http://www.circuitclinicaltesting.com/our-partners.php

Like I said, all I'm trying to do is change the speed and frequency of the slides but it doesn't seem to work.

HTML

  <div class="owlcarousel">
  <section class="partner_slider slider_section header_height">
      <ul id="main-slider" class="owl-carousel main_slider">

          <div class="display-table">
            <div class="table-cell">1
              <div class="container">
                <div class="col-md-1"></div>
                <div class="slider_content">
                  <h2 class="text-left txt_white">PARTNER PERSPECTIVE</h2>
                  <h3>"Circuit Clinical provides us with the opportunity to shift the current paradigm when it comes to clinical research. They have been able to integrate research within our practice without the upfront cost."</h3>
                  <h2 class="txt_white">Dr. Raul Vazquez, MD</h2>
                  <p>Urban Family Practice</p>
                </div>
              </div>
            </div>
          </div>


          <div class="display-table">
            <div class="table-cell">
              <div class="container">
                <div class="col-md-1"></div>
                  <div class="slider_content">
                   <h2 class="text-left txt_white">PARTNER PERSPECTIVE</h2>
                   <h3>“Until now, I haven't had the opportunity to participate in clinical research because we didn’t have the infrastructure in place to do so. Circuit Clinical has provided the tools and infrastructure while also bringing the trials to us so we can begin enrollment immediately.”</h3>
                    <h2 class="txt_white">Dr. Dennis B. Chugh, MD</h2>
                    <p>Northtowns Cardiology</p>
                 </div>
              </div>
            </div>
          </div>
      </ul>
  </section>
  </div>
</div>

JS

<script>
  $(document).ready(function() {

    $("#main-slider").owlCarousel({
      slideSpeed : 10000,
      autoPlay : true,
      autoplaySpeed:10000
    });

  });
</script>

I managed to figure it out. It was looking for autoplayTimeout. Adding the following to the script settings solved the issue!

    autoplayTimeout: 10000,        
    smartSpeed: 1000,

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM