Slick: swipeToSlide : true, swiping backwards issue when infinite looping

Created on 5 Jan 2016  路  11Comments  路  Source: kenwheeler/slick

Best description is the fiddle:
http://jsfiddle.net/fmo50w7n/185/

When the fiddle page is loaded instead of swiping forward try to swipe backward ( in the nav section), and you will see the issue. Even when you swipe forward whenever the first slide (index 0) got the class slick-current, it is not possible to swipe freely backwards! Only possible to swipe back one slide, so the current slide sets to the last index and you'll free to swipeToSlide backwards...
The issue occurs only when the first slide is slick-current otherwise you can freely swipeToSlide backwards...

Confirmed

Most helpful comment

When options.infinite is enabled, the lowest index in the array of indexes returned by getNavigableIndexes is options.slidesToScroll * -1 (in the fiddle, -1).

This conflicts with options.swipeToSlide, which attempts to navigate to indexes lower than this.

Following @mazzaker and changing the lines:

        breakPoint = _.options.slidesToScroll * -1;
        counter = _.options.slidesToScroll * -1;
        max = _.slideCount * 2;

back to:

        breakPoint = _.options.slideCount * -1;
        counter = _.options.slideCount * -1;
        max = _.slideCount * 2;

allows the nav slider to work, but the top slider gets a little funky with the wrapping (not sure if this happens anyways).

This change was made in commit f57b2a04ab83e1a3a15e070ffcde9457d257ab45 _"Fixing dot navigation"_. When these changes are undone (and dots are enabled in the fiddle), everything seems to still work.

Here's an example fiddle that replaces the getNavigableIndexes function during runtime: http://jsfiddle.net/6z5Lv1ts/

All 11 comments

Wow, thats super wacky and totally a bug. Great catch!

In one project i have a similar situation and it works well but this project is still on 1.4.1
Above jsfiddle with 1.4.1 works well, hope that help you ;)

@kenwheeler your plugin is awesome, thanks for the great job...

I have found the lines:

breakPoint = _.options.slidesToScroll * -1; counter = _.options.slidesToScroll * -1; max = _.slideCount * 2;

on the older version it was:

breakPoint = _.slideCount * -1; counter = _.slideCount * -1; max = _.slideCount * 2;

In Slick.prototype.getNavigableIndexes ...

I don`t know why these lines where changed in the past, so the bugfix do not seems trivial for me :)

I'm having the same issue.

When options.infinite is enabled, the lowest index in the array of indexes returned by getNavigableIndexes is options.slidesToScroll * -1 (in the fiddle, -1).

This conflicts with options.swipeToSlide, which attempts to navigate to indexes lower than this.

Following @mazzaker and changing the lines:

        breakPoint = _.options.slidesToScroll * -1;
        counter = _.options.slidesToScroll * -1;
        max = _.slideCount * 2;

back to:

        breakPoint = _.options.slideCount * -1;
        counter = _.options.slideCount * -1;
        max = _.slideCount * 2;

allows the nav slider to work, but the top slider gets a little funky with the wrapping (not sure if this happens anyways).

This change was made in commit f57b2a04ab83e1a3a15e070ffcde9457d257ab45 _"Fixing dot navigation"_. When these changes are undone (and dots are enabled in the fiddle), everything seems to still work.

Here's an example fiddle that replaces the getNavigableIndexes function during runtime: http://jsfiddle.net/6z5Lv1ts/

Thanks @AlbinoDrought ! Your fix for replacing getNavigableIndexes worked for us.

Just increase the touchThreshold
e.g touchThreshold: 100

When options.infinite is enabled, the lowest index in the array of indexes returned by getNavigableIndexes is options.slidesToScroll * -1 (in the fiddle, -1).

This conflicts with options.swipeToSlide, which attempts to navigate to indexes lower than this.

Following @mazzaker and changing the lines:

        breakPoint = _.options.slidesToScroll * -1;
        counter = _.options.slidesToScroll * -1;
        max = _.slideCount * 2;

back to:

        breakPoint = _.options.slideCount * -1;
        counter = _.options.slideCount * -1;
        max = _.slideCount * 2;

allows the nav slider to work, but the top slider gets a little funky with the wrapping (not sure if this happens anyways).

This change was made in commit f57b2a0 _"Fixing dot navigation"_. When these changes are undone (and dots are enabled in the fiddle), everything seems to still work.

Here's an example fiddle that replaces the getNavigableIndexes function during runtime: http://jsfiddle.net/6z5Lv1ts/

I just wanted to point out that '_options.slideCount' is an undefined value and should be _.slideCount instead! But a really great solution!

Is there any solution for this? I love slick, but this is a pretty nasty bug.

how can we track swipes using GTM? any ideas?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

msavov picture msavov  路  3Comments

rahi-rajeev picture rahi-rajeev  路  3Comments

Libig picture Libig  路  3Comments

crstauf picture crstauf  路  3Comments

k-lusine picture k-lusine  路  3Comments