Menu icon Foundation
Foundation Magellan Sticky Breaks with Slick Slider

I'm currently working on a project where I need to use a Slick Slider on the same page where I want to use a Magellan sticky nav. When I implemented the code I had the Magellan block after the Slick Slider. When I did that the links worked fine, but when I scrolled up the navigation did not stick (become fixed). I did some testing and found that if I put the Magellan code before the slider it did work as expected. What I've discovered is that it seems like Magellan is calculating the sticky height before the Slick Slider images are collapsed. So basically it's counting the height of each image in it's calculation. I verified this by setting a huge margin at the bottom of my page. When I scroll down far enough, sure enough, the Magellan navigation sticks. Does anyone have any idea how I may work around this quirk?

MagellanSlick Slidersticky

I'm currently working on a project where I need to use a Slick Slider on the same page where I want to use a Magellan sticky nav. When I implemented the code I had the Magellan block after the Slick Slider. When I did that the links worked fine, but when I scrolled up the navigation did not stick (become fixed). I did some testing and found that if I put the Magellan code before the slider it did work as expected. What I've discovered is that it seems like Magellan is calculating the sticky height before the Slick Slider images are collapsed. So basically it's counting the height of each image in it's calculation. I verified this by setting a huge margin at the bottom of my page. When I scroll down far enough, sure enough, the Magellan navigation sticks. Does anyone have any idea how I may work around this quirk?

Adam Christianson about 4 years ago

I'm still trying to solve this one. I now have a sample up here, http://03c7bc9.netsolhost.com/listing/banyan-estate/#details you can take a look at so you can see the issue. Notice if yu scroll down far enough the menu will stick.