I am using iosSlider
in my website. I need to change the animation speed of slider.
I have read documentation in iosSlider. I found I've to use autoSlideTransTimer
for controlling slider speed. But I couldn't achieve that.
Here is my JavaScript
code:
function InitImageSlider() {
$('.iosSlider').iosSlider
desktopClickDrag: true,
snapToChildren: true,
infiniteSlider: true,
navSlideSelector: '.slider .navigation li',
onSlideComplete: function(args) {
if(!args.slideChanged) return false;
$(args.sliderObject).find('.slider-info').attr('style', '');
$(args.currentSlideObject).find('.slider-info').animate({
left: '15px',
opacity: '.9'
}, 'easeOutQuint');
},
onSliderLoaded: function(args) {
$(args.sliderObject).find('.slider-info').attr('style', '');
$(args.currentSlideObject).find('.slider-info').animate({
left: '15px',
opacity: '.9'
}, 'easeOutQuint');
},
onSlideChange: function(args) {
$('.slider .navigation li').removeClass('active');
$('.slider .navigation li:eq(' + (args.currentSlideNumber - 1) + ')').addClass('active');
},
autoSlide: true,
scrollbar: true,
scrollbarContainer: '.sliderContainer .scrollbarContainer',
scrollbarMargin: '0',
scrollbarBorderRadius: '0',
keyboardControls: true
});
}
I am using iosSlider as well and this works for me:
$('.iosSlider').iosSlider({
snapToChildren: true,
scrollbar: false,
scrollbarHide: true,
desktopClickDrag: true,
infiniteSlider: true,
autoSlideTransTimer: 2000,
navPrevSelector: '#sl-left',
navNextSelector: '#sl-right',
onSlideChange: slideChange,
onSliderLoaded: slideChange,
responsiveSlideContainer: false,
responsiveSlides: false,
autoSlide: true
});
is significantly slower than:
$('.iosSlider').iosSlider({
snapToChildren: true,
scrollbar: false,
scrollbarHide: true,
desktopClickDrag: true,
infiniteSlider: true,
autoSlideTransTimer: 100,
navPrevSelector: '#sl-left',
navNextSelector: '#sl-right',
onSlideChange: slideChange,
onSliderLoaded: slideChange,
responsiveSlideContainer: false,
responsiveSlides: false,
autoSlide: true
});
So autoSlideTransTimer
works for me!