I’ve created a nav menu that animates a rectangle to slide to the position of the pressed button (so the user can see the transition to a new page). I’m using Tapped and Focusing. All works fine, and the rectangle stays where it is until I click on another button, but - the rectangle reverts back to its starting position when I start to scroll on other page elements outside of the nav bar.
Is there any way to set this in pure ux so that the rectangle will only move if a nav button is pressed? Some way to say ignore clicks on the page outside the navbar?
Here is my code:
```auto
--pages and main content follows--
```
Navbutton styles are in a separate file:
```auto
```
---
Hi guys,
In yesterday’s release, we included `` and `` which makes cases like this easier.
Basically, you define a `` for each of the states an object can be in.
Here is an example use case:
[https://gist.github.com/Duckers/edafa6caf7cbf338b195](https://gist.github.com/Duckers/edafa6caf7cbf338b195)
---
And here is a an bit more fancy example using animation mixers: [https://gist.github.com/Duckers/8c93e3fb28dbaf4df6cd](https://gist.github.com/Duckers/8c93e3fb28dbaf4df6cd)
And a video of how it looks:
We will clean these up and publish as official examples soon 🙂
---