I have a fixed navbar and a few buttons that have scroll triggers. Every one of those scrolls passed the top of the section that they are assigned to. I’ve tried some of the suggestions on here, but they don’t seem to work. Here is the link to my published site: http://www.fluscientific.com/
Here is the public share link: https://preview.webflow.com/preview/fluscientific?preview=75b1f2278413b3932decb114f8cdeff4
Here is my public share link: LINK
(how to access public share link)
Hi @kmcguir, thanks for the links. It would be really helpful to leave a screenshot of the button link that is clicked, what page it is on, and what it looks like when the section has finished scrolling.
Normally by checking the instructions about how to get smooth scrolling to align, this can be corrected.
Thanks in advance.
The button/link to scroll is the arrow in the circle in pic1. When clicked, it should scroll down as shown in pic2 where the bottom of the navbar stops at the top of the About Us section. But, pic3 is what actually happens. The top of the About Us is cut off by the navbar. There are other buttons on this homepage that also have scroll effects and the navbar covers the top of their sections as well.
Hi there, the smooth scroll with align is particular to the navbar widget, so I would suggest to put your link inside of a navbar with the color set to transparent the mobile menu to be disabled in the settings panel.
The menu structure with the navbar widget would look something like:
Then try the link again and this time the smooth scrolling should work ok. Let me know if it is unclear.
Drag a navbar to your page, remove the default navmenu and links, and drag your existing link block into the navbar container. Change the main navbar element (with home icon) so the back ground is transparent.
I hope this helps.
Hmmm I couldn’t get that to work. I’ve restored it to a previous version now. Is there no simple way to get the bottom of the navbar to stop at the top of the about section?
Hi @kmcguir,
Take a peek at my quick video, does this help?
https://cl.ly/0n1k3I1Q0W2p/Screen%20Recording%202017-05-01%20at%2011.10%20PM.mov
That could work. Why doesn’t just unlinking the navbar as a symbol and then changing its class name to header work and the tag in settings to header?
Ok, here is the solution to my problem. My Navbar 2 symbol was in a section named Navbar 2. That section needed to be directly under Body, have a class of header, and a tag of header. The other most important part was that the section needed to have a height exactly the same as the height of the Navbar 2 symbol. My Navbar 2 section (not symbol) had a height of about 1 px, which means the about us section was scrolling to that height (1 px below the top of the browser). Hope that helps.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
