CODEWITHSUNDEEP
javascriptscrollspyslick.js
mateostabio
mateostabio

Reputation: 1028

Slick Slider js not recentering with scrollSpy

So I created a horizontal mobile Menu navigation with Slick Slider and also added a scroll Spy to add active class to the li when scrolling passed categories. So far it looks great. Here is the link, make your browser be mobile size (because it is only visible on small screens) And visit http://www.2017.jukeboxburgers.com/menu click on the " Explore the Food... " button, and swipe.

When you click in the nav it works well, the li gets centered, but now if you scroll down some more until you pass a few categories, and then click the "explore the food" button again, the current category you scrolled too is not centered.

Is there an event listener for something like this? Or a way to make it recalculate the li.active and center it??

Upvotes: 0

Views: 437

Answers (1)

mateostabio
mateostabio

Reputation: 1028

So was able to make it work!

So my scrollSpy puts a class of .active on the li that I've passed. Slick Slider wasn't going to them but now it's working. Here's how I did it:

var current_index = $(".mobile_food_slider .active").attr("data-slick-index"); $(".mobile_food_slider").slick("slickGoTo", current_index);

Upvotes: 1

Related Questions