Bonjour,
Je construit ma première application mobile avec Apache Cordova, et j'ai un petit souci au niveau de mon menu.
J'ai une icone permettant d'afficher un menu latéral (comme dans beaucoup d'applications comme Youtube par exemple)
J'ai un overflow:hidden sur l'élément body et quand j'ouvre le menu, je fais un transition:translate3d pour déplacer mon contenu vers la droite et laisser la place à mon menu (qui lui aussi se décale vers la droite avec un transitiontranslate3d)
Cela fonctionne bien, mais j'ai remarqué que je pouvais slider horizontalement sur mon application quand le menu est ouvert. La propriété overflow:hidden s'annule quand j'effectue un translate3d et du coup il y a un ascenseur horizontal qui apparaît :/
J'ai trouvé quelques réponses à ce problème sur Internet, mais les solutions évoquées ne fonctionnent pas :
[url=https://code.google.com/p/android/issues/detail?id=25499]Première piste[/url]
La solution envisagée ici est de passer par un translate 2D, mais cela ne fonctionne pas pour moi. Le problème reste le même.
[url=http://jbkflex.wordpress.com/2013/04/04/css3-transformations-showing-content-outside-overflowhidden-region-in-firefoxandroid/]Deuxième piste[/url]
Cet article parle du même problème se produisant sur la plateforme Android et le navigateur Firefox. J'utilise une webview iOS via Cordova donc l'environnement n'est pas le même. J'ai quand même testé mais cela ne fonctionne pas et quand je fais un opacity:0.9 sur le body (qui est mon élément en overflow:hidden), le contenu se masque totalement. Si je définie la propriété opacity à 1, le contenu s'affiche mais le problème persiste.
Je poste donc ici dans l'espoir que quelqu'un saura m'aiguiller vers une solution :)
Merci d'avance