Chrome mobile ignorant débordement

Je suis en train de jouer avec la création d'une application web pour Android. J'utilise phonegap avec JQM, mais j'ai un problème.Chrome mobile ignorant débordement

J'implémente un menu déroulant, et pour cela j'ai trouvé un exemple simple sur internet.

http://www.aldomatic.com/jqm/fb-menu-style/

Ce menu simple glisse de la gauche, et cette partie fonctionne très bien, mais lorsque je tente de le glisser dans un problème que je reçois. L'ensemble fait défiler la page, et ce malgré moi ayant

#mobileViewport { 
    overflow: hidden; 
}

(La balise body a l'id de mobileViewport

Je l'ai essayé d'ajouter à la balise html aussi, mais en vain.

est-ce un bug? et est-il solution?

Source

2012-12-30 Delusional Logic

Par défaut, les pages JQM sont positionnés absolument, en dehors de l'écoulement de leur élément contenant (si l'élément contenant est statiquement p ositioned).

Ajoutant overflow:hidden sur l'élément contenant (corps) ne va donc pas aider.

Si vous appliquez position:relative à #mobileViewport qui devrait faire l'JQM pages mobiles à flux maintenant correctement de l'élément contenant et le overflow:hidden devrait fonctionner.

Cependant, je soupçonne que ce n'est probablement pas une bonne idée et lié à causer d'autres problèmes d'affichage CSS. (Je me rappelle avoir joué avec ça une fois et avoir d'autres problèmes comme effet secondaire)

Probablement une meilleure idée est d'ajouter le débordement: caché aux éléments de la page JQM eux-mêmes.

<body class="ui-mobile-viewport"> 
    <div id="mypage" data-role="page" class="ui-page"> 
    ... 
    </div> 
</div> 

#mypage { 
    overflow:hidden; 
}

REMARQUE: Si vous avez un pied de page, vous pouvez appliquer le overflow:hidden à l'élément enfant .ui-content à la place.

Source

2012-12-31 04:13:03 asgeo1

Chrome mobile ignorant débordement

Répondre

Questions connexes