Question

Does anyone know how to prevent the cluster(or nested) slides to play upon loading? I've tried entering "$AutoPlay: false" inside "var slider1Options", "var slider2Options" and "var slider3Options", but it doesn't work.

Reference: http://www.jssor.com/demos/slider-cluster.html

Thank you in advance.

Was it helpful?

Solution

Please remove following code,

        //slider cluster controller code begin
        function SliderCluster(mainSlider, autoPlayInterval) {
            var _Self = this;
            var _NestedSliders = [];
            var _NestedSliderCurrent;

            var _CaptionInCounter = 0;

            function OnChildSliderStateChange(currentIndex, progress, progressBegin, idleBegin, idleEnd, progressEnd) {
                if (progress == idleBegin) {
                    if (!(++_CaptionInCounter % 4)) {

                        _NestedSliderCurrent && _NestedSliderCurrent.$Pause();

                        mainSlider.$Play(true);
                    }
                }
            }

            function OnMainSliderStateChange(currentIndex, progress, progressBegin, idleBegin, idleEnd, progressEnd) {

                _NestedSliderCurrent = _NestedSliders[currentIndex];

                if (_NestedSliderCurrent) {
                    if (progress == idleBegin) {

                        mainSlider.$Pause();
                        _NestedSliderCurrent.$Play(true);
                    }
                    else if (progress == progressBegin) {
                        _CaptionInCounter = 0;
                        mainSlider.$Play(true);
                    }
                }
            }

            function OnMainSliderSwipeStart(position, virtualPosition) {
                _NestedSliderCurrent && _NestedSliderCurrent.$Pause();
                mainSlider.$Pause();
            }

            function OnMainSliderPark(slideIndex, fromIndex) {
                _CaptionInCounter = 0;
                mainSlider.$Play();
            }

            _Self.$AddChildSlider = function (childSlider, slideIndex) {
                _NestedSliders[slideIndex] = childSlider;
                childSlider.$On($JssorSlider$.$EVT_STATE_CHANGE, OnChildSliderStateChange);
            };

            _Self.$Start = function () {
                mainSlider.$On($JssorSlider$.$EVT_PARK, OnMainSliderPark);
                mainSlider.$On($JssorSlider$.$EVT_STATE_CHANGE, OnMainSliderStateChange);
                mainSlider.$On($JssorSlider$.$EVT_SWIPE_START, OnMainSliderSwipeStart);

                mainSlider.$Play(true);
            }
        }

        var sliderCluster = new SliderCluster(jssorSliderc);
        sliderCluster.$AddChildSlider(jssorSlider1, 0);
        sliderCluster.$AddChildSlider(jssorSlider2, 1);
        sliderCluster.$AddChildSlider(jssorSlider3, 2);
        sliderCluster.$Start();

        //slider cluster controller code end

See also Jssor (nested slider): how to disable AutoPlay?

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top