Hello, the bottom line is:
It is necessary to modify the slider script so that the delay of the zero slide and the delay of the remaining slides are different options. For example, set the delay of the first slide to 5 seconds, and all the rest 15 seconds.

Link to script / Script page

Please explain how to cope with this task. Thank you very much in advance.

    2 answers 2

    Virtually did not fix anything in the plugin, although the little bird wins at some points. Added only a crutch ( otherwise you will not name ), for your task. To begin with - here is a working example . Now I will explain.

    • line 18 ( in the example ) - add: diffDelay: false ;
    • line 174, 177, 179 - change setInterval and clearIterval to setTimeout and clearTimeout, respectively, and change options.delay to options.diffDelay? options.diffDelay [cIndex]: options.delay;
    • line 171 - after slideMove (cIndex, 'next'); add, as in the example: timeOut = setTimeout (autoPlay, (options.diffDelay? options.diffDelay [cIndex]: options.delay));

    In the plug-in connection options, we set the diffDelay parameter with an array of delay values ​​for each slide separately. The number of values ​​should be equal to the number of slides !!! In the example, I set the delay for the first slide to 3000, for the second 1000 and for the third - 8000. And note that if you set the diffDelay parameter, then the delay will simply be ignored.


    UPD PS Although I thought that it was not necessary to make the number of values ​​equal to the number of slides. Change everywhere (three pieces of code):

    options.diffDelay ? options.diffDelay[cIndex] : options.delay // на следующее options.diffDelay[cIndex] ? options.diffDelay[cIndex] : options.delay 

    Now, if you need to set a delay for the first slide only, we write this:

     $(your_elem_selector).smSlider({ autoPlay : true, duration : 500, diffDelay : [1000] }); // Только для второго слайда $(your_elem_selector).smSlider({ autoPlay : true, duration : 500, diffDelay : [null, 1000] }); // Для второго и четвертого слайда $(your_elem_selector).smSlider({ autoPlay : true, duration : 500, diffDelay : [null, 1000, null, 4000] }); // И так далее... 

      It may be a little easier - do not climb into the code of the smSlider() . It has options-functions with which you can control the settings of the slider. If you take .animationComplete , this is a function that knows the parameter toIndex - the slide number. Can be tied to this parameter.

      All the slider settings are available in this function through this , only in case of changing the delay option, it is necessary to reset the internal timeOut slider. You can reset it by hovering the cursor over the slider.

      That is, we write the mini-function timerClear()

       var $smSlider = $('#sm_slider'); var timerClear = function(){ $smSlider.mouseover(); // навели курсор $smSlider.mouseout(); // убрали курсор }; 

      And use it in the slider, like this:

       $smSlider.smSlider({ autoPlay : true, delay : 15000, animationComplete : function(toIndex) { switch(toIndex) { case 0: timerClear(); this.delay = 1000; // время задержки перед вторым слайдом одна секунда break case 1: timerClear(); this.delay = 2000; // время задержки две секунды break default: timerClear(); // для всех остальных слайдов ставим 15 секунд this.delay = 15000; } } });