Bro, really thanks for this video. I had been trying on my own some way to do this interaction but I gave up and was looking for a tutorial hoping someone had done it. That was you.
the idea is good, but if you then try to use the navigation menu and you haven't passed the hero section, when the mouse goes over it again, you will reactivate the animation making the original sticky bar state reappear.
@@cricmanian yes,figma isn't the apropiate tool to do this function, but to do the idea in the design is cool. but also I was doing a research how to do it and I found that using variables for sure can do it.
hi, i kind of have a problem when doing this. if i were to try and put my mouse on my showcase, it stays at the transparent part and if i move my mouse outside of my showcase then it will show my other version of navbar. the problem is that if i scroll out of my showcase it like glitches out and switches very fast to my other navbar before showing my original even though my mouse would be outside of my showcase already.
I managed to get rid of the glitchy behaviour by setting it up differently. Instead of how @femijohn suggested, I simply used a colour variable to show or hide the fill colour of the header component (using the same idea of mouse enter & leave as trigger). This also reduced complexity by making it unnecessary to duplicate the page!
@@eyeruham hey thanks for getting back to me, did this for a ux project a while back and I've not been on figma since 🙃 Good luck with whatever you're doing!
