JQuery移動100％高度的頁面，這等於可見區域

我在處理iPhone上的網站高度時遇到了問題。以下設置在所有其他設備（ipad，android手機）上運行得非常好，但在iphone設備上，網址欄消失後頁面高度不會更新，並且頁面底部會顯示空白區域。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;">

它舒爾不招我。

來源

2011-12-15 13:51:23

對不起，沒有爲我工作。 iPhone上的問題仍然存在。 – 2011-12-15 14:28:23

刪除

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

JQueryMobile計算必要的高度並設置最小高度風格的網頁，以確保它填補了整個頁面。

你會注意到，在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

恩，那是你說的錯語言;） – 2014-03-17 14:58:29

JQuery移動100％高度的頁面，這等於可見區域

回答

相關問題