The Ol' Right to Left
From Complex Navigation Patterns for Responsive Design:
Instead of sub-nav items appearing underneath the parent category like the multi-toggle, the next level of navigation is offscreen to the right and animates in when requested.
- Sexy as hell – It’s not often you ‘ooo’ and ‘aah’ over navigation, but the right-to-left animation is certainly elegant.
- Follows mobile conventions – most major smartphone platforms have some form of right-to-left animation convention for drilling down into an experience.
- Scalable – Good for navigations that have a lot of levels.
- Complex – Not necessarily a con per se, but this pattern has a lot of (literal) moving parts. Just make sure to keep things accessible, cover your bases and test on as many different devices as possible.
- Animation performance – Animation performance varies greatly across different devices and platforms. Some mobile platforms handle animations just fine, while others are choppy as shit. And keep in mind that some platforms don’t support animation at all, so the sudden change in nav state may be jarring to the user.
In the Wild