I would love some help with another way to solve this problem, please.
I had an element on my page to suggest scrolling down. I did it by creating a flexbox section with fixed position, 100vh and Z-index higher than all other layers. Then put a pulsing arrow image (WF animation) into a link block which is aligned to bottom-center. (clicking the link block scrolls to turn section.) Set up a scroll-related disappearing act. Great!
Everything was going well in Preview mode, but I discovered that once the site was exported, clicks weren’t being passed through, so the site was effectively broken. (Interestingly, the button with an interaction (Click for current promotion) is the only one that didn’t work while published with Webflow. All other buttons worked fine, adding to my confusion about why the site was broken.)
I am aware of pointer-events: none solution but #1 it doesn’t work in <IE10 and #2 I have a link block in the layer.
I’m perfectly happy to do this in a different way, but I’m not experienced enough to know what other options are possible.
I have considered animating hide/show instead of opacity, but I’ve discovered that if you scroll to a section (/#dax, /#contact) and reload the page, the pulsing arrow layer appears again. This is because the disappear interaction is based on the user scrolling 10% down as opposed to a page-anchor (I have no idea how to do that or if possible).
A solution would be greatly appreciated!
All the best,
Here is my Webflow-published site: https://pfss-2019-2.webflow.io/
Here is the externally-published site, without pulsing arrow: https://www.puzzlefactory.uk/