question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Synced sliders: removing the same index slide confuses the asNavFor indexes

See original GitHub issue

When using two sliders in the slider syncing setup where you have a main slider on top and a navigation slider underneath, and you use slickRemove to remove the same 1 slide with the same index from both of the sliders, then the navigation slider will control the sliders with the wrong index. i.e.: when you remove slide #2 from both, then slick slide #3, both slider will slide to #4 instead.

[ https://fiddle.jshell.net/ananaszjoe/ruky7kqd/ ]

use this jsfiddle to reproduce your bug: http://jsfiddle.net/simeydotme/fmo50w7n/ we will likely close your issue without it.

Steps to reproduce the problem

  1. have 2 sliders each referring to each other with asNavFor.
  2. Have one of the sliders display multiple slides with slidesToShow and be centered with focusOnSelect
  3. use the slickRemove method to remove a slide from each slider ( with the same index! )
  4. click one of the slides in the slider that displays multiple slides and -> The sliders will slide to not the appropriate slide, but the next ones from that.

What is the expected behaviour?

Ideally when removing a slide from a slider that has the asNavFor set, the affected sldiers would refresh and clicking a slide would focus that one and not the next one from it.

What is observed behaviour?

When you remove the same index slide from the two sliders, and slick on a slide to focus both slides to that index, the sliders will slide to the index that’s the next from the one that was clicked. …

More Details

  • Which browsers/versions does it happen on? I tested on the latest Chrome
  • Which jQuery/Slick version are you using? Discovered the issue on 1.6.0, reproduced it in jsfiddle using https://rawgit.com/kenwheeler/slick/master/slick/slick.js
  • Did this work before? No knowledge of that

Issue Analytics

  • State:open
  • Created 7 years ago
  • Comments:6

github_iconTop GitHub Comments

3reactions
prestopastocommented, Aug 29, 2016

I was experiencing the same issue. I’m using two synced sliders for images on a product detail page for an ecommerce site. When changing options on a product I was adding all the new slides via slickAdd to the end of the slider and then removing all the old slides with a loop calling slickRemove and index 0 repeated for the number of slides I was removing.

I reversed the order and removed the old slides first, effectively emptying the sliders, and then added all the new slides. asNavFor worked correctly after that.

I’m sure the issue exists for your case of removing a single element from the middle of the list. I’m just confirming that someone else was seeing the same problem since your issue had been here so long with no other comments.

1reaction
JiveDigcommented, Sep 27, 2016

Got it. Wow, never would have thought to do it that way, thanks… Working now 😃

Read more comments on GitHub >

github_iconTop Results From Across the Web

Slick.Js asNavFor Resetting to First Slide Each Time
I have two carousels, both have five slides, with the top carousel showing one slide at a time and the bottom showing all...
Read more >
Re: Mac Spotlight not indexing Google Drive files ... - Page 5 ...
It seems that on Mac, the Spotlight is not indexing the files that are in the ... Useful to know that Google Drive...
Read more >
Alma 2022 Release Notes - Ex Libris Knowledge Center
Existing data will be indexed gradually with the semi-annual indexing job in the following weeks. These records will be available for search in...
Read more >
Take Control of DEVONthink 3 (1.9)
copying them into DEVONthink's storage area—indexing without importing. ... when the Sorter slides open, drop the item onto your icon of choice.
Read more >
Apache HBase ™ Reference Guide
You can stop HBase the same way as in the quickstart procedure, using the bin/stop-hbase.sh command ... Keep Configuration In Sync Across the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found