1

I have used the default home page slider functionalities. the slider is running one by one. Need to stop the automatic slider running. I have checked the js file skin\frontend\rwd\default\js\lib\jquery.cycle2.min.js and skin\frontend\rwd\default\js\lib\jquery.cycle2.swipe.min.js files to stop the transition. But not able to stop the transition.

  • before posting the answer edited :( – hari haran Jun 5 '15 at 11:48
3

Go to skin/frontend/rwd/default/js/slideshow.js and replace code with this:

$j(document).ready(function () {

    // ==============================================
    // UI Pattern - Slideshow
    // ==============================================

    $j('.slideshow-container .slideshow')
        .cycle({
            slides: '> li',
            pager: '.slideshow-pager',
            pagerTemplate: '<span class="pager-box"></span>',
            speed: 6000,
            pauseOnHover: true,
            swipe: true,
            prev: '.slideshow-prev',
            next: '.slideshow-next',
            fx: 'scrollHorz'
        }).cycle('pause');
});

See cycle('paus'), this is telling the slider to not scroll automatically.

Hope this helps.

  • Or you can just use timeout property. – Altaf Hussain Feb 9 '16 at 7:58
1

The proper way is to use the timeout field. Edit the file mentioned by @Aadarsh which is skin/frontend/rwd/default/js/slideshow.js or copy this file to your skin folder and edit it as below:

$j('.slideshow-container .slideshow')
    .cycle({
        slides: '> li',
        pager: '.slideshow-pager',
        pagerTemplate: '<span class="pager-box"></span>',
        speed: 600,
        pauseOnHover: true,
        swipe: true,
        prev: '.slideshow-prev',
        next: '.slideshow-next',
        fx: 'scrollHorz',
        timeout: 0
    });

Thank you

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.