I’m new to Webflow but catching on quickly. Easy app and easy concepts. Nice.
I’m trying to figure out how to make a notifications top bar that pushes out a drawer below it when you click. This is not a fly-out menu, but rather it needs to push/pull toggle all the content below it.
Like this: jQuery Effects - Hide and Show
Is it a matter of literally using that code somehow?
I’m not a coder or programmer but I have some limited experience with it.
Hi DRC, welcome to the forum. No custom code required here! You can achieve this with a simple interaction.
Once you have your layout created, and the content you’d like to toggle in its own container, just create an interaction to show/hide the container that holds the extra content.
Thank you. But there’s much more to it than that, correct? How do I hide the div in the first place? And how do I target that div? So far I don’t see those options.
I thought it might be easier to just take a quick video and show you how I created the interaction. It’s pretty intuitive and just as simple as it sounds. Let me know if I can clarify anything for you!
Hi ColemanChrisB,
Thank you very much for that, very kind of you to go to the extra trouble. Following your example, I was able to create exactly what I was hoping for - thank you!
Is there no way to add easing, btw?
There is, but not on a direct hide/show. You could play around with also adding an opacity: 0 to 100 animation in the same interaction on that Div. Or, you could wrap it in ANOTHER Div, set it to overflow: hidden, and maybe apply a size 0-100 animation to that to simulate something similar to a normal fly-in that would sit above the content.
This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.