jquery-mobile - jQuery Mobile の背景が全高ではありません

Question

jQuery Mobile ページを iPhone にロードすると、ページの一部が最初のビューポートからはみ出します。そもそも最初のビューポートの外にあるスペースは、本来あるべきグレーではなく、白です。このコード行を使用して高さを 100% に設定しようとしましたが[data-role=page]{height: 100% !important; position:relative !important;}、それでもうまくいきません。

Answer 1

JQMページでもいつも同じ問題があります。これを使用して、ページの高さを100％にします。

$(document).delegate('#yourPage', 'pageshow', function () {
    var the_height = ($(window).height() - $(this).find('[data-role="header"]').height() -   $(this).find('[data-role="footer"]').height());
    $(this).height($(window).height()).find('[data-role="content"]').height(the_height);
});

お役に立てれば。

Answer 2

まず、誤用しないでください!important。CSSの何が問題になっているのかを診断するには、FirefoxのFirebug/Chromeの開発者コンソールを使用できます。（SafariとIEには似たようなものがあります）。一部のCSSがオーバーライドされたり、レイヤーがオーバーラップしたりする場合があります。

HTMLコードとjQueryスクリプトがなければ、私はこれを本当に助けることはできませんが、通常、コンテンツを完全な高さにするには、htmlCSSとbodyCSSを使用するように設定する必要がありますheight: 100%;。