JQueryモバイル100％の高さのページ（可視領域に等しい）

iPhoneのウェブサイトの高さに問題があります。次の設定は他のすべてのデバイス（ipad、android phones）でもうまく機能しますが、iphoneデバイスでは、URLバーが消えてページの下部に空白が表示された後にサイトの高さが更新されません。JQueryモバイル100％の高さのページ（可視領域に等しい）

<!DOCTYPE html> 
<html> 
    <head> 
     <title>temp</title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
     <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
     <meta name="apple-mobile-web-app-capable" content="yes" /> 

     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
     <script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 

     <style type="text/css"> 
      .ui-page{ 
       min-height: 100% !important; 
      } 
     </style>  
    </head> 

    <body> 
     <div data-role="page" id="loadscreen" data-theme='c'> 
      <div data-role="content"> 
       <div> 
        <a href="#" onClick="window.scrollTo(0, 1)">Scroll Up</a> 
       </div> 
      </div><!-- /content --> 
     </div><!-- /page --> 
    </body> 
</html>

サイト：http://jsfiddle.net/hb8NH/2/

出典

2011-12-15 Simon D.

私のためのトリック次

<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">

それはSHUREへのない変更してみてください。

出典

2011-12-15 13:51:23

申し訳ありませんが、私のために働いていません。まだiPhoneで同じ問題。 –

が

.ui-page{ 
    min-height: 100% !important; 
}

を削除JQueryMobileは、必要な高さを計算し、それがページ全体を満たすことを確認するページへのmin-heightスタイルを設定します。

SafariのiPhone（分の高さを取り除いた後）に少し上のスクロールが表示され、「スクロールアップ」テキストが表示されないことがわかります。 JQueryMobileは画面サイズに基づいて最小の高さを計算しています。そうすれば、iphoneのホーム画面（Safariのツールバー、ヘッダーやフッターがない）に保存しても、ページは画面いっぱいになります。

出典

2012-08-02 20:23:28 JDubDev

は、WebViewのネイティブプロパティを設定してください：

私のために働く

// fix orientation issue 
[webView setAutoresizingMask:(UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth)];

。

出典

2013-10-21 12:21:27

これは間違った言葉です。 –

JQueryモバイル100％の高さのページ（可視領域に等しい）

答えて

関連する問題