slickPause() not working

Created on 30 Oct 2014  Â·  20Comments  Â·  Source: kenwheeler/slick

var popupSlide = $('.popup-con').slick({
autoplay: true,
slidesToShow: 1,
slidesToScroll: 1,
prevArrow: '.popup-prev',
nextArrow: '.popup-next'
});

$('.btnPause').on('click', function () {
popupSlide .slickPause();
});

Most helpful comment

I'm sorry, I missed the part where you paid for this and now I'm required to do what you want and can have shit talked to me?

All 20 comments

Please follow contributing.markdown

@xianghongai Until it's fixed, set autoplay:false and use popupSlide.slickPlay(). You'll then be able to pause it with popupSlide.slickPause()

Super Mensa, I tried your method but it still won't work. Are there any updates / suggestions on this issue?

Was banging my head with this.... there seems to be a bug, or I must be doing something wrong. The below code works, but if I set autoplay to true, and remove homeCarousel.slickPlay(), it does not.

//document ready
jQuery(document).ready(function () {
    //initialise slick carousel
    var homeCarousel = jQuery('.home-carousel').slick({
        autoplay: false
    });

    //start the animation
    homeCarousel.slickPlay();

    //on click event to stop the slider if the user clicks on one of the arrows
    jQuery(".home-carousel > button").click(function () {      
        jQuery('.home-carousel').slickPause();
    });
});

@josephpspiteri I wonder if pauseOnHover is interfering. Have you tried it with/without?

@josephpspiteri @kenwheeler Not sure about anyone else, but pauseOnHover was exactly the issue I was having — setting that to false solved the issue for me.

If this is the last carousel we'll ever need, maybe add some tests to ensure everything works as intended?

I'm sorry, I missed the part where you paid for this and now I'm required to do what you want and can have shit talked to me?

@kenwheeler :+1:

You got any ideas on how I can visually regression test this? I'm all ears.

@kenwheeler - calm down, I didn't mean to kick you or make demands.

The issue here just doesn't seem like such an edge case to me. Maybe setting up some form of basic tests could benefit all of us (ie. less issues).

For visual tests, something like https://github.com/Huddle/PhantomCSS could work, but it might be overkill.

I've wanted to do it for a while and I've tried with very little benefit

Here's a fiddle of the original issue pause slideshow

I can't seem to reproduce the error. May have been fixed in the meantime - or the problem arise under different circumstances.

@kenwheeler Given the amount of options the plugin provides, there are bound to be problems in some kind of scenario. I would just assume that including tests would make it easier for users to pinpoint the specific problem (and hopefully give them the opportunity to fix it themselves).

@kenwheeler - calm down, I didn't mean to kick you or make demands.

😞😒

@supermensa it's an open source project, why don't you go ahead and create them? make some positive contributions 😌

@simeydotme I would argue that suggesting you add tests - or any other form of discussion within an open source project - is a positive contribution.

I was merely pointing out that while claiming that X is the best something - or the last X you'll ever need and struggling with 127 open issues, where most of them doesn't follow your contributing markdown rules; my suggestion is that maybe you're going about it in the wrong way.

I'd like to help out, but the original author(s) would probably be the best to determine how tests are managed (framework, scope etc.). I believe that if you have it, people will use it.

@supermensa There area 127 issues because:

a. I'm a new father
b. It was just the holidays
c. I have a day job

So for the last month or two I haven't had the kind of time I wish I had to devote to open source. Also of those 127 issues, I'd say a solid quarter are feature requests, a quarter are people who don't know javascript asking how to set it up, another quarter are people who do know javascript but are trying to make it do something unreasonable in some ridiculous edge case, and the other quarter are legitimate.

If I didn't have to respond to the first 3/4 and manage all those issues, I'd be able to stay more on top of the legit 1/4.

Slick is the best carousel. Can you really argue that it isn't? I don't think that because one edge case slips through the cracks it qualifies it as a shitty carousel. And what can I do about people not following contributing.markdown? We are sitting here , bullshitting, on an issue that didn't follow contributing.markdown. I asked for a reduced test case in jsFiddle that took 6 months to get delivered.

I need to see context. This could be the _.paused state acting up, or there could be not enough slides (line 344) or any other external variable.

In regards to tests, Slick has like 30 options, thats like 4000 different possible combinations. In 5-6 different browsers, on 3 operating systems. And half of the shit that can go wrong can't even be reliably tested. Look at my other libraries, the tests are there. This one is special. Its just not that cut and dry, or the tests would be there already.

And thank you for your contribution, because it is positive. I appreciate it.

@kenwheeler Thanks for that response.

Regarding issues. I'd imagine it would be hell to maintain a popular project like this.
I'd suggest being more ruthless and close issues that doesn't follow guidelines - and be strict in choosing which features to focus on and which to ignore (especially regarding weird edge cases). No one is probably ever going to build a slider that is perfect for everyone.

(Congrats on becoming a father. Skip the tests & go play!)

Anybody reading this, I found the solution to my issue here:
http://stackoverflow.com/questions/29707645/slick-carousel-functions-not-executing

Instead of calling .slickPause(), or .slickPlay(), call .slick('slickPause') or .slick('slickPlay').

Thanks for the awesome slider @kenwheeler !!

Your welcome @GrateHairyBallz

i solved the problem finally!
It's better to pause the slick animation with slick('slickpause') on mouse over, and then you can run it again on mouse out.

`

$('.fun-slideshow').slick({
        slidesToShow: 3,
        slidesToScroll: 1,
        autoplaySpeed: 0,
        speed: 1000,
        cssEase: 'linear',
        autoplay: true,
})
$('.slideshow').mousedown(function() {
     $(this).slick('slickPause');
});
$('.slideshow').mouseout(function() {
     $(this).slick('slickPlay');
});`
Was this page helpful?
0 / 5 - 0 ratings