Mohit Bhansali
Mohit Bhansali

Reputation: 1785

How to control animation speed in iosSlider?

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
});
}

Upvotes: 2

Views: 2252

Answers (2)

user1142121
user1142121

Reputation: 49

It's an old question but was never answered. You're looking for autoSlideTimer': 5000 //where the number indicate how long the slides pause. You can set it in jquery.iossslider.js file.

Upvotes: 0

Matthijs
Matthijs

Reputation: 146

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!

Upvotes: 2

Related Questions