FULLSCREEN SLIT SLIDER AUTOPLAY

Question

I am using this slider. Everything working well but having problem in autoplay. When I click on navigation arrow on slider or on Nav dot on bottom. After that autoplay not working.

This is the link CLICK HERE

Auto play function not there, you have to download it and make autoplay : true in Js.

Js Name : jquery.slitslider.js

$.Slitslider.defaults = {
    // transitions speed
    speed : 800,
    // if true the item's slices will also animate the opacity value
    optOpacity : false,
    // amount (%) to translate both slices - adjust as necessary
    translateFactor : 230,
    // maximum possible angle
    maxAngle : 25,
    // maximum possible scale
    maxScale : 2,
    // slideshow on / off
    autoplay : true,
    // keyboard navigation
    keyboard : true,
    // time between transitions
    interval : 6000,
    // callbacks
    onBeforeChange : function( slide, idx ) {
        return false;
    },
    onAfterChange : function( slide, idx ) {
        return false;
    }
};

score 7 · Accepted Answer · answered Dec 26 '13 at 08:52

7

Because the script contains code like that whenever you pressed the function stop the slideshow

switch (keyCode) {

                case arrow.left :

                    self._stopSlideshow(); //this line stops autoplay
                    self._navigate( 'prev' );
                    break;

                case arrow.right :

                    self._stopSlideshow();
                    self._navigate( 'next' );
                    break;

            }

answered Dec 26 '13 at 08:52

Sridhar R

20,190
6
38
35

Then, what should i do to keep it changing even after click on these arrows or nav dots ? – Dec 26 '13 at 09:02
I did, but it's still same case, autoplay not working – Dec 26 '13 at 09:11
1

Thanks man :) it's done. i search morel links like that (_stopSlideshow();) and commented them . it's working now :) thanks alot – Dec 26 '13 at 09:13
Hi, i having again a problem, when i click on main links and again coming back on the slider page.. the slider not working . this is the test site .http://coeindia.in/test/kubic/ – Jan 03 '14 at 11:54
i tested it after clicking navigation returned to main page it plays a slide – Sridhar R Jan 04 '14 at 04:14
Hi Sridhar, I tried it alot. if you click on navigation links ( like, about us , contact so so) then get bag to home page. then the slider not working and repeating same slide as we come to home page. it's not happening always but it's happening. – Jan 09 '14 at 05:56

score 1 · Answer 2 · edited Jun 08 '16 at 07:33

Nothing to do much just make the autoplay option true where autoplay : false,

///

    $.Slitslider.defaults = {
    // transitions speed
    speed : 800,
    // if true the item's slices will also animate the opacity value
    optOpacity : false,
    // amount (%) to translate both slices - adjust as necessary
    translateFactor : 230,
    // maximum possible angle
    maxAngle : 25,
    // maximum possible scale
    maxScale : 2,
    // slideshow on / off
    autoplay : true,
    // keyboard navigation
    keyboard : true,
    // time between transitions
    interval : 4000,
    // callbacks
    onBeforeChange : function( slide, idx ) { return false; },
    onAfterChange : function( slide, idx ) { return false; }
};

`

Luen · Answer 3 · 2014-12-17T01:06:11.050

0

You could use the built in parameters and start the slideshow again after user interaction.

$('#slider').slitslider({
    autoplay: true, 
    interval: 6000,
    onAfterChange: function(slide, idx) {
        slitslider._startSlideshow(); // Starts the autoplay again
        return false;
    }
}),

edited Dec 17 '14 at 01:06

answered Dec 17 '14 at 00:55

Luen

3
5

score 0 · Answer 4 · edited Apr 12 '16 at 09:49

find this code in jquery.slitslider.js and change 2 false options to true, then add _startSlideshow() function to bottom of it

_stopSlideshow: function() {
        if ( this.options.autoplay ) {

            clearTimeout( this.slideshow );
            this.isPlaying = true; // set this to true
            this.options.autoplay = true; // set this to true
            this._startSlideshow(); // Add this line

        }

    }

FULLSCREEN SLIT SLIDER AUTOPLAY

4 Answers4