Hi Webflow Community
So, I’ve hit an issue with my While Page Is Scrolling animation and its connection with navbar section links.
You could call it a bug, but I don’t think its a bug with Webflow necessarily as much as it probably is to do with how I laid out my elements (there are a fair few div containers with Absolute positioning), but I’m unsure if this is what is causing the “bug”.
What should happen :
Essentially when the user scrolls with the scroll wheel on their mouse, the page animation should appear gradually, as it currently does without issue.
However, if the user presses the “Work” button in the top aligned navbar (I made its text yellow in the video (below) for context), they should be directed to the first project in the list of five projects on the page scrolling animation (to exactly 22.5% down the page). The same logic should persist for the “About” button in the navbar; that should direct the user to the about section. The same goes for the “Contact” button; contact section.
What is happening [ “BUG” ] :
While the “While Page Is Scrolling” animation works perfectly fine and as it should through the use of the scroll wheel, the navbar buttons’ logic does NOT, which is the issue at hand.
If you press the “Work” button in the navbar currently, for some reason the button’s on-click event will only scroll the page down about 5%.
The animation for when the first project elements are all visible is exactly 22.5% down the page (hence the reasoning for my previous comment above).
So, instead of it scrolling 5% down the page on click, it should scroll to 22.5% down the page.
Also, for some reason (again), once it gets to 22.5% down the page (by repeatedly clicking the “Work” button), the on-click event still registers and proceeds to incrementally scroll down the page even further beyond where its section should “end”.
The video for context :
Firstly displaying the usual (and working) scroll animation via the scroll wheel (00:00 - 00:22).
Lastly displaying the issue regarding the navbar button logic (00:23 - 00:53).
Could anyone offer any advice to spawn a solution to this issue, please?
Is it to do with my element structure or is it a Webflow bug? or something else entirely do you think?
I’ll leave my webflow project link at the bottom of this post so everyone can see the bug for themselves, and the structure of my site elements and their properties.
Many thanks in advance for any help anyone has to offer.
P.S: I should note, the site (linked below) is not exactly responsive at the moment, viewing it in the designer at either 1920px or 1512px are preferable for a decent viewing experience.