Streaming live at 10am (PST)

Looking to add a transition to my nav bar


#1

Hi Webflowers -

I'm looking to create a transition in my navbar, a little after scrolling begins -
very similar to this:
http://www.designoftheworld.com/braille-bricks/

What I don't understand is what TRIGGER I should use.
I would think SCROLL - but scroll seems to be based on "scroll into view" and "scroll out of view"
Obviously, if the transition is in the navbar, it is "in view" as soon as the page loads... ergo - won't work how I want it to.

Here's my share:
https://preview.webflow.com/preview/scottbarbey70956011502405-174587d1dcd71?preview=a330d7436fdf7cb80b67549fe4313eab


#2

Hi @scottbarbey You are correct. You would need to use a scroll interaction trigger.

When a certain element comes into view, you can animate a different element to do something. It may take some time to fully understand and learn how to harness this great power, but you can do it! :smiley:


#3

so in other words, use a lower element on the page for the transition in the nav?
think I understand. thx, PixelGeek.


#4

Hi @scottbarbey, that is exactly correct. For example, if you want the navbar to scroll in when you scroll to the digital work header section, you would create an interaction on that element, with the scroll trigger, and on the scroll into view, target the navbar class:

Take peek here, it may help: https://interactions.webflow.com/fade-in-navbar-video

Let me know if any questions :slight_smile:


#5

thanks dave -
I'll try tackling this as soon as I figure our my other navbar problem.
(me and nabbers are not friendly)


#6

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.