I want to create transition that triggers only when value is going towards one direction.
To be more precise I want to create fade out effect - animate opacity from 1 to 0, but later when value is going from 0 to 1 I want to it to jump instantly. For example imagine simple visual element with image background, when I click it I want to fade it with uss transition, but when I click again in the middle of transition or after it finished I want opacity to jump to 1 and play fade out again.
I tried to do some stuff with scheduler, but I am not sure this is the way. Any tips?
I would personally go with schedulers where your opacity is tracked within your code. on first click, start a scheduler with a method that fades over time and store the opacity. on second click, look if the scheduler is running. If it is, do the other logic.
Thank you for input! So you basically mean to animate opacity manually with scheduler and whenever I click to cancel previous animation and start new one from the beggining.
When I think about it now is there other way to do this maybe using classes? If that was standard css it would be possible to set transition in class or pseudoclass and run it one sided. Or what if I would override transition duration and delay during the animation, would that be possible to move value to the start and restore default duration or something like that?