android2でモーダルウインドウ上でテキスト入力すると画面が上下に動く

android2で上記の不具合が発生していることがいろいろなところで報告されているものの解決法が見つかりにくく、今回自分もこの件で苦しめられたため参考程度にまとめてみます。

まとめ

  1. android2ではpositionやopacity,transformなどレイヤー表現に関わるプロパティで不具合が多発する
  2. なるべくモーダルウインドウ上でテキスト入力はさせない方が安全
  3. どうしても必要な場合はandroid2対策用のjavascriptで下のレイヤー(#wrapper,#container等)を非表示にし、モーダルウインドウを画面の上部に固定すると画面が上下しなくなる。(ただし、見た目的には別ページが開いたような印象になるのでモーダルっぽさが失われる)

参考

  • http://qiita.com/HieroglypH/items/69daba0e33ac61a05953
  • https://github.com/twbs/bootstrap/issues/5589#issuecomment-9745069

AWS構築サービスの全てをまとめた資料を公開中

ハックノート(TOWN株式会社)では、AWSの導入や構築支援を行っています。AWS導入メニューやサービス詳細、構成例や費用を掲載した資料をダウンロードできます。

AWSの新規導入やAWSへの移行を検討の際は、ぜひご参考ください。