Comment gérer la navigation descendante pour l'application réactive sur mobile?
Je travaille sur une application Web réactive. Il fournit un résumé sur différentes verticales. Pour afficher les détails d'un utilisateur vertical, vous pouvez effectuer un zoom avant. Jusqu'à présent, l'exploration descend jusqu'au niveau 5. La navigation pour l'exploration dans une verticale est une variante d'un fil d'Ariane.
Désormais, il est nécessaire d'apporter des modifications pour que l'application Web fonctionne également correctement sur les appareils mobiles.
J'ai trouvé quelque chose de similaire sur StackExchange Existe-t-il une meilleure solution que le fil d'Ariane pour les catégories en cascade sur mobile?
Mais j'ai besoin de quelque chose de plus. Aussi, comment dois-je procéder avec le changement?
[Modifier 1 - Image ajoutée]
[Edit 2 - Ajout d'une solution possible] Le menu fil d'Ariane semble une option rationnelle. 
Ce que vous devez faire, c'est masquer le fil d'Ariane tout en les rendant accessibles sur mobile. Il y a trois modèles qui pourraient vous intéresser:
Affichage uniquement du niveau précédent . Voici un exemple réactif: http://codepen.io/bradfrost/full/dKulf
Affichage du fil d'Ariane sous forme de liste déroulante . Encore un exemple réactif: http://codepen.io/bradfrost/full/DCgax
Les laisser tomber - la manière la moins élégante, mais peut être utile dans certaines situations spécifiques au projet. Et exemple à nouveau: http://codepen.io/bradfrost/full/IcoL
(Redimensionnez la fenêtre de votre navigateur pour voir comment les exemples fonctionnent.)
Vous pouvez combiner les deux premiers en affichant toujours le tout premier niveau (pour permettre à vos utilisateurs d'accéder plus facilement au niveau supérieur), par exemple:
- [Niveau supérieur] [Liste déroulante]
- [Niveau supérieur] ... [Niveau précédent]
C'est parce que je pense que les utilisateurs voudront le plus souvent aller bact au sommet et à un niveau supérieur - mais cela peut aussi être spécifique au projet.