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.

Slider syncing issue (nav slider out of view area)

See original GitHub issue

Hello. I have noticed issue with nav slider, when I have next settings of my slider syncing:

`$(‘.slider-for’).slick({ slidesToShow: 1, fade: true, dots: false, asNavFor: ‘.slider-nav’, arrows: true });

$(‘.slider-nav’).slick({ focusOnSelect: true, dots: false, slidesToShow: 5, asNavFor: ‘.slider-for’ });`

It happens when I use slick version >=1.7.1 On version 1.6.0 all looks fine.

v1.7.1 - https://codepen.io/Fred_UA/pen/wvagWMg v1.6.0 - https://codepen.io/Fred_UA/pen/eYNggxX

Could you advise some solution to fix my problem?

Issue Analytics

  • State:open
  • Created 4 years ago
  • Comments:5

github_iconTop GitHub Comments

1reaction
MarcGuaycommented, Mar 17, 2021

Confirming that my similar issue is resolved by using the non-minified version of 1.8.1 (which is actually just 1.8.0?).

The only difference between 2 files (minified and non) seems to be this https://github.com/kenwheeler/slick/issues/3560.

1reaction
paddyhamburgcommented, Feb 27, 2020

I found the solution. As soon as I use version 1.8.1, but not the minified version, it works. The minified version still has the error.

Working version 1.8.1 (not minified): https://codepen.io/paddyhamburg/pen/OJVmRvO

Read more comments on GitHub >

github_iconTop Results From Across the Web

Slick Slider with Slider Synching and Sliding only via Arrows
So in the official documentation of the slick-slider in the Slider Syncing section the bottom slider is moving when clicking on a slide....
Read more >
Slick Slider Syncing - CodePen
Insecure Resource. The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https....
Read more >
Tiny Slider 2 - GitHub Pages
Option Type Description axis “horizontal” | “vertical” Default: “horizontal”. The axis of the slider. gutter positive integer Default: 0. Space between slides (in “px”). edgePadding positive...
Read more >
Sliders | Themeco Docs
While the Inline Slider uses Flexbox to power its layout, the Stacked Slider uses a 1x1 CSS Grid layout with each Slide positioned...
Read more >
No way to stop Slider Syncing from Main Slide to thumbnails?
For the slideshow I'm working on, I will have always 4 slides. I want to use the row of 4 thumbnails for navigation...
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