2012年1月20日
iOS、Androidにおけるposition:fixed;の制限
こんにちは、鴨田です。
スマートフォンアプリを作成する際、
やはりタイトルバーやフッターメニューは欠かせないところです。
jQuery MobileやiUIなどのライブラリを使えば、大して苦労はしないのですが、
ライブラリを使いたくない場合もあると思 います。
仮に独自で実装する場合は、上部と下部に固定する必要があり、
HTMLになじみのある人であれば、すぐに"position:fixed;"を使えばいいだろう、
と気づくと思います。
確かにそうなのですが、実は"position:fixed;"を使用するには、
ある程度の条件が存在します。
■iOSの場合
iOS 5以降でしか対応していません。
■Androidの場合
Android 2.2以降でしか対応していません。
また、viewportでuser-scalable=yesにしていると、
固定されず、"position:absolute;"と同等の効果となります。
もしも、下位バージョンにも対応したい場合、
iScrollを使用するのもいいと思いますが、
あまりスペックのよくないAndroid端末では、スクロール時の少し動きが怪しいので、
使用する際には何を優先させるべきかを考えてから採用するとよいと思います。
