Android3でiframeの中にあるリンクやフォームの不具合

2013/10/26

Android3で最初の画面(デバイスのディスプレイ)で表示されたiframe内のものは動くが、iframeをスクロールして表示したものや、スクリーン外にあると不具合を起こす。
タップはできるが遷移しない。フォーカスは当たるが何も起こらない現象など致命的なバグがあります。

デモ

解決方法

scrolling属性を付与して値にnoを入れると正常に動作する。
ただしスクロールできないので、iframe内のコンテンツの高さを設定するか、JSで取得する必要がある。

iframeの高さ取得は下記プラグインが便利です。
https://github.com/house9/jquery-iframe-auto-height

注意点

iframe内で使用したフォーム要素へのフォーカス問題もあるので、iframeは使用しないのが一番です。

※ フォーカスしたら、検討違いの場所にスクロールされます。

About me
hosicame
昭和61年生まれ。フロントエンドエンジニア。Autohotkey大好きな私がお送りします。

Recent Posts