jquery mobile和iphone - 頁面底部的空白處

我有一個jquery移動網頁。它在桌面瀏覽器和android上看起來不錯。jquery mobile和iphone - 頁面底部的空白處

但在iphone的safari中，我在頁面底部有一個奇怪的空白空間。它看起來像.ui-page的最小高度問題，因爲這個空白與safari的標題欄+ url-bar一樣高。

任何想法？

編輯：我發現這個問題：它是：

html, body { 
    overflow-x: hidden !important; 
    position: relative !important; 
}

來源

2013-03-28 bernhardh

它與'UI-content'高度來完成。它發生在'data-role = content'具有與data-role = page'不同的'data-theme'時。 – Omar

我希望這個代碼解決您的問題。

Example

// Get height of the document 
var screen = $(document).height(); 

// Get height of the header 
var header = $('[data-role=header]').height(); 

// Get height of the footer 
var footer = $('[data-role=footer]').height(); 

// Simple calculation to get the remaining available height 
var content = screen - header - footer; 

// Change the height of the `content` div 
$('[data-role=content]').css({'height': content });

來源

2013-03-28 14:51:09 Omar

不，不是真的..也許你可以看看它：http：//www.urlgone.com/25e111/ – bernhardh

它看起來像加載器div造成它。試試這個'$（'div.ui-loader'）。hide（）;'或'remove（）;'。但先嚐試'hide（）;'。 @leftjustified – Omar

這是完美的工作。 –

問題是與在min.css最小高度屬性。變化

UI頁面{最小高度：「400像素」}

希望工程:)

來源

2013-04-30 11:41:30

對不起張貼在一個老問題，但最近我堅持這一點。

原來，這個問題是由某些瀏覽器通過人們提供的隱藏地址欄的JS函數引起的。

如

function hideAddressBar(){ 
    if(document.documentElement.scrollHeight<window.outerHeight/window.devicePixelRatio) 
    document.documentElement.style.height=(window.outerHeight/window.devicePixelRatio)+'px'; 
    setTimeout(window.scrollTo(1,1),0); 
} 
window.addEventListener("load",function(){hideAddressBar();}); 
window.addEventListener("orientationchange",function(){hideAddressBar();});

來源

2015-12-02 16:21:23 Ryan

jquery mobile和iphone - 頁面底部的空白處

回答

相關問題