高さを動的にする必要がある html5 IOS アプリ内でスクロール div を作成することは可能ですか?
私の頭痛の背景を少し説明すると、アプリには 3 つのメイン パネルがあります。ユーザーは左または右にスワイプして、通知/設定を含む 1 番目と 3 番目のパネルを表示できます (Facebook アプリの場合と同様です。3 つの外側のパネルはすべて固定位置です)。 .
メイン パネルには 6 ページが含まれます。これらはすべて、メニュー選択によって非表示および表示される絶対配置の div です。表示された各 div (またはページ) はスクロールする必要がありますが、すべてのコンテンツは動的であるため、高さを設定できません。
固定高さの解決策をいくつか見つけましたが、動的高さの解決策はこれまでのところありません..
助言がありますか？
スクロール Div
iOS 5+ のもう 1 つの新機能は、div がついにスクロールできるようになったことです。div スクロールを作成するには、以下を追加するだけです (この例ではヘッダーが固定されていますが、アプリに合わせて位置を調整します)。
.scrollable {
position: absolute;
top: 50px;
left: 0;
right: 0;
bottom: 0;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}
ここでのコツは、通常オーバーフローを設定する場所に -webkit-overflow-scrolling を追加することです。Apple の実装の欠点は、既に絶対的な最上位または最下位にいるときに、期待どおりに div が跳ね返らないことです。スクロール中の div をバウンスする代わりに、ページ全体をバウンスし、ブラウザのクロムを表示します。これは、javascript の修正が必要な場所です。
スクロール可能性については、この例を試してください。