CODEWITHSUNDEEP
javascriptjqueryhtmlcssslider
Shawn T
Shawn T

Reputation: 83

Extend Slide Duration Of Slider Pro Slideshow

I am using Slider Pro for a auto cycling slideshow on a website. I need to extend the duration that each image of the slideshow is shown. In the documents it mentions a property called "slideAnimationDuration" which is defaulted to a value of 700. I tried changing the value but it had no effect. There also was not much info online either. If someone could please assist me that would be wonderful!

Here is my code. 

jQuery(document).ready(function($) {
  $("#my-slider").sliderPro();
});

$("#my-slider").sliderPro({
  width: '100%',
  height: $(".header").height(),
  slideAnimationDuration: 5000,
  arrows: true,
  buttons: false,
  waitForLayers: true,
  fade: true,
  autoplay: true,
  autoScaleLayers: false
});
html,
body {
  padding: 0;
  margin: 0;
}

.header {
  height: 100vh;
}
<div class="header">
  <div class="slider-pro" id="my-slider">
    <div class="sp-slides">
      <div class="sp-slide">
        <img class="sp-image" src="https://dl.dropbox.com/s/rp1imhbw1s06vjv/IMG_4875.JPG" />
      </div>
      <div class="sp-slide">
        <img class="sp-image" src="https://dl.dropbox.com/s/6ffmnfh0oukrgb7/IMG_5064.JPG" />
      </div>
    </div>
  </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Upvotes: 4

Views: 628

Answers (3)

Jean da Silva
Jean da Silva

Reputation: 1

autoplayDelay: 15000 //wait 15 seconds to change slide

Upvotes: 0

Shawn T
Shawn T

Reputation: 83

Figured it out, there's a "autoplayDelay" property that uses milliseconds

Upvotes: 2

fwr nr
fwr nr

Reputation: 697

In the documentation you have linked the 'slideAnimationDuration' property seems to define how long the sliding animation takes to complete. Not the interval between each slide animation.

I can't currently see anything in the documentation to change the duration the slide is displayed for. But your issue is you have simply misunderstood what a property is for. The documentation is worded a little weird in my opinion so I think that was easy to miss.

Upvotes: 0

Related Questions