Permanet button opacity/color change after click needed - HELP

Design help Animations & Interactions
1

hello there, nice to meet u ppl over here, its my first post and Im quite new to webflow :wink:
doing the tutorials for a week now, which is quite a lot of input not beeing a real designer
and only with a fair amount of background when it comes to html/css programming.

so I have a question related to buttons and states, Im not finding any answer if I google it or going through the tutorials (maybe Ive missed that one). Its actually quite simple:

I have two buttons that have a background color opacity of value x (example 55%).
When I hover each of them, its set to 100% (state: hover).
Now what Im looking for is:

  • the button which is clicked (!) once, should stay with its opacity at 100% (even Im getting out of button hover focus)
  • when the first button is clicked, the second button sets its opacity back to 55%

I cant find the right start, except doing a on click animation. but not sure how and whats the right way.

2

In the states section of 1 button, click on “Focused” and use that state. It’s basically the ‘Active’ state, which is what you’ve probably heard online before. That’ll do it.

3

but focused only stays until the mouse leaves the focus area of the button as far as I know ?
I will give it a try

4

WOW, Im so happy, it works !!! thx a lot man !
I allways thought focus only does mean, as long as the mouseicon stays in the button area,
thats how focus worked in axure.

5

Awesome, glad it works! Have fun.

6

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