Jump to content
Search Community

Jumping from section a to z when using scrollTrigger section layering

blubububub test
Moderator Tag

Go to solution Solved by akapowl,

Recommended Posts

Hi. 
currently i have a landing page with a layered section, similar with the codepen URL i mentioned.

the difference is, i have a navigation bar on the top of my page.

i've been wondering how can i jump from section one section to another with a navigation bar.

 

for example, when i am on the first panel and trying to jump to fourth panel,
at the end of the animation, the scroll is jumping back from fourth to the third panel

 

(i choose to use a target element instead of `y * inner height` because i want to skip some panel for the navbar)

 

Thanks!

See the Pen WNGbBmq by rifkiachmads (@rifkiachmads) on CodePen

Link to comment
Share on other sites

  • Solution

Hey @blubububub

 

You could integrate some sort of check on the callbacks to detect wether a button was clicked or not, and only if that is not the case, fire what's inside the callbacks of your ScrollTriggers. This way, they will only get triggered when not navigating the page via your nav-buttons.

 

See the Pen 76a69a09b2e78cd1995779310b2edd6b by akapowl (@akapowl) on CodePen

 

 

 

 

Edit:

You will also notice similar behaviour to what is mentioned in this thread though (in your demo), when reloading the page while you are in a section further down. So I also integrated a varaible to check for wether the page is settingUp - seems to work.

 

 

 

  • Like 3
  • Thanks 1
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...