Jump to content
Search Community

ScrollTrigger - Reverse Number link issues

JayShukla test
Moderator Tag

Go to solution Solved by akapowl,

Recommended Posts

Hello, Hope you guys doing well.

I make layered pinning example but a little different what I have here is content, images, and footer in between these I add up layered pin example with 

navigation links compatibility.

The reason for making this topic is navigation links compatibility when I click the number on "ascending order" the panels work fine everything switch(slides) one by one but if I click "descending order" the panels do not work as expected Like 5, 4, 3, 2, 1.

 

For Example, if I'm on panel five then I click 1 number, then it's dragging me to panel ID 2 not on panel ID one.

 

image.thumb.png.f8f10f4eba97ac19dc33ee80e3c9cc94.png

See the Pen rNWOqPm by elsueno (@elsueno) on CodePen

Link to comment
Share on other sites

  • Solution

 

Hey @JayShukla

 

Well, that's a plain logic thing.

 

Since you have a section before your layered panels, that will throw off the calculations. So you would have to include the total height of that section in your calculations (total height meaning the height including the margin that you have set on it).

 

Here is one way you could do that

 

See the Pen 801cf62ba028df3f867364a137f42c65 by akapowl (@akapowl) on CodePen

 

 

Seems to work for me.

Is that better for you?

 

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...