Streaming live at 10am (PST)

How to use focus state correctly?

When and how do I use the focus state correctly for objects? I can’t seem to get this state to activate at all. I might be using it incorrectly, however. What I am trying to do is create a transition when an object is on the screen rather than hover. Is this possible?

Definition and Usage The :focus selector is used to select the element
that has focus.

Tip: The :focus selector is allowed on elements that accept keyboard
events or other user inputs.

Thanks! I figured I was using it in correctly.

So now how would I go about creating an event for an object when it’s on the page? I’m trying to get an object to have an opacity transition when the user reaches a certain section. Is this possible with the tools webflow provides?

Oh so you’re saying when you scroll down to a section some images will fade into view, but only when you reach that section?

If that’s what you’re talking about we don’t support that yet, but that is a sweet feature! Something I want to add! It doesn’t have to do with :focus state which is for what it looks like when a user clicks on an input field (usually a blue glow).

yea thats exactly what I’m trying to do. I knew I was using focus incorrectly… but now I know how to do something else! Thanks! And I’ll keep my eye out for it, that’d be a nice transition to have.

Enjoy :slight_smile:

1 Like