モバイル版のウェブサイトの固定ヘッダーとフッター

Question

私は自分のWebサイトのモバイル版を開発しています。私は、Samsung Galaxy S androidモバイルデバイスで動作しています。Froyo（2.2）です。

標準的なインターネットブラウザで見たときに私はしたい、との間でスクロール可能なページの内容と固定ヘッダと（画面上に常に表示されている）固定フッタを有します。

ボディのパディングとソート（PC上のブラウザで見ると動作するように見える）の組み合わせを試しましたが、解決策が見つからないようです。

誰でも助けてもらえますか？

注：私はこのような何かをしようとした場合：

<div id="header" style="position:absolute; top:0px; left:0px;height:200px;overflow:hidden;"></div> 
<div id="content" style="position:absolute; top:200px; bottom:200px; left:0px;overflow:auto;"></div> 
<div id="footer" style="position:absolute; bottom:0px; height:200px; left:0px;overflow:hidden;"></div> 

ヘッダーとフッターの両方が固定されているが、コンテンツがスクロール可能ではないが、例えばそれは固定されているようにも見える

もちろんAndroid Froyo 2.2のブラウザかもしれません。

誰でも？

Answer 1

次のサイトでは、この問題の状態を説明しています。

http://bradfrostweb.com/blog/mobile/fixed-position/

著者は、いくつかのJavaScriptのソリューションを提案します。

• iScroll 4
• Scrollability
• Sencha Touch
• Jquery Mobile

Answer 2

特定のメタタグを追加すると、位置：固定はAndroid 2.2以降でpartially supportedに過ぎないようです。 iOSではサポートされていないことにも注意してください。しかし、動作をエミュレートするためのスクリプトがあります（これは手元にありません）。

Answer 3

これは一度だけ作成したいだけで、複数のモバイルデバイスを透過的にサポートしたいと思うので、あなたは既に最小限の画面スペースで作業している場合は、固定ヘッダとフッタを望む理由は、JQuery Mobile

Article on page layout

Answer 4

：見てみましょうか？すべてのブラウザウィンドウが実用的には十分ではないかもしれないと考えてください。誰かがあなたのページを風景で見て、固定ヘッダーとフッターの両方を持っているとどうなりますか？

800x480のNexus Sでも、100％ズームでは、ページの半分をヘッダーとフッターで表示し、それはポートレートで表示されます。風景では、それを忘れて...

うまくいく別のデザインはありますか？

リンクの用途は何ですか？彼らが非常に重要な場合は、別の方法でそれらを繰り返すことが理にかなっているかもしれません。