I’ve created a component for a section div that includes program navbars. I then used this component on all program pages (energy, natural habitat, waste, etc). I changed the program symbol/name instance for each program.
Viewing this component on the Natural Habitat program home page I edited this component (NOT the component’s instance) to have it move up out of view on scroll down, then back into view on scroll up.
Checking on other Natural Habitat pages, as well as on pages from the other programs, I see that this interaction applied to the component (not the instance) did not carry through to any other instances. I then applied the interactions to the class of the section containing the navbar used throughout all the program pages, hoping that would work across all the pages, but it still only was applied to the one page I viewed when editing the component.
Going to another page, and editing the component I see that I can choose the two animations I created (NavLeave and NavEnter) and apply them respectively to scroll down and scroll up. That’s a lot better than having to start from scratch rebuilding the two animations.
But I would think Webflow would have set it up so that when applying the animations to a class it would automatically apply them to the class on whatever page it appears.
Is what I’ve done all that is possible? Or is there a way to get the animation to automatically be applied to the class of the section with the navbar on all pages on which the component appears?
Here is my public share link: [LINK](Webflow - Climate Action Evanston)
(how to access public share link)