Slick: Unslick by default, until hitting a breakpoint

Created on 15 Apr 2015  路  4Comments  路  Source: kenwheeler/slick

I've read this:

"Set settings to "unslick" instead of an object to disable slick at a given breakpoint."

What would be nice is to be able to have it unslicked by default, that is, without determining a breakpoint width as I currently only want slick on mobile.

E.g.

responsive: [
            {
                breakpoint: 1920, // I don't want to specify a value here! 
                settings: 'unslick'
            },
            {
                breakpoint: 1010,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }

Is there a way to do this currently that I've missed?

Thanks for the great plugin.

Most helpful comment

My workaround for this was to set the option mobileFirst to true, which makes a lot of sense, making this not really an issue. Feel free to close.

mobileFirst: true,
responsive: [
    {
        breakpoint: 1010,
        settings: 'unslick'
    }
]

All 4 comments

My workaround for this was to set the option mobileFirst to true, which makes a lot of sense, making this not really an issue. Feel free to close.

mobileFirst: true,
responsive: [
    {
        breakpoint: 1010,
        settings: 'unslick'
    }
]

Awesome. I was considering this earlier today. Good work, sir.

It's possible to close your own issues ;)
Thanks.

Only issue with your solution @oliverbenns is on resizing it doesn't slick.

$('.product-slider').slick({
        mobileFirst: true,
        slidesToShow: 1,
        slidesToScroll: 1,
        dots: true,
        focusOnSelect: false,
        arrows: false,
        responsive: [
            {
              breakpoint: 680,
                settings: 'unslick'
            }
        ]
    });
Was this page helpful?
0 / 5 - 0 ratings