Webflow 201: Scroll to anchor animation is not working
For some reason webflow prevents not only the default "scroll to anchor" animation (which should work with the secondary button - "Discover More" on Hero section) but also does not handle custom code I put into "before <body>" custom code section.
After clicking on the secondary button, the page just "jumps" to the feature section. I have also tried to assign the secondary button its own ID but no luck.
I have found in some webflow article, that this could happen if there is an image on a page with "lazy load" settings, so I have set ALL images to "Eager mode" includignthe logos. Still the same error behavior.
Another workaroud whould be setting fixed height of the images but I did not do that because this simply MUST work out of the box. Am I doing something wrong or should I report a bug to webflow? I am really desperate (I can see this behavior on my other pages as well, scrolling suddenly not working).
I'd appretiate if someone could check the project https://preview.webflow.com/preview/furnitime-5267bc?preview=ee69c552a7acdb150b5d02e552410455&workflow=canvas
2 Replies
Hi
Is this what you're trying to achieve? (see the video attached below)
If that's the case, then all you need to do is to change the Link Settings of the "Discover More" to point to the ID of the features section (#features) instead of using the Webflow "Page section" option - see image attached
Yes, this is exactly the behaviour I want to achieve. But your solution does not help. Actually, both methods (directly put "#features" into url vs select section ID from "Page section") are equal - both just put "#features" into "href" attribute. You can inspect the code in browser and you'll see the same code.
Wait a minute, you did the video with MY preview? How its even possible its working for you and not for me? I have tried 4 web browsers and it is not working in any!
Ok, directly putting "#features" as "URL" will not help anyway because it turns off the modal (because its happening on "button" class.
OMG, I have found out its working on my another computer... wha the heck is going on?
2 of the browsers are without any extension so it must be something in mac OSX preventing this? The other computer where scrolling is working is windows 10.
Ok, I found this problem. I had "Reduced motion" turned on under System Settings > Accessibility > Display. Never thought this would apply on normal web sites as well.