想要一個100％寬度/高度的iPhone / iPad / iOS網頁

Question

我試圖獲得一個只是設備寬度/高度100％的網站，向下滾動到足以擺脫地址欄。 希望這有道理嗎？

我只需要簡單的尺寸，這樣我就可以將設備滾動到0,0並盡可能多地查看我的頁面。 例如，簡單地為320x400（320寬度，400可能=高度 - 標題欄 - 頁腳）

這樣做的原因是我將一個DIV放在一個頁面上，這個頁面是一個“視口”，可以移動到內容中，想想谷歌地圖。 我只是想讓這個div填滿所有空間。

問題是我似乎無法檢測到可用的窗口高度。 我似乎總是得到屏幕大小 - 標題欄 - 地址欄 - 可選的調試欄 - 頁腳。 如何檢測“最大可能尺寸”？

Answer 1

把html,body height:100%; 並且div為position:absolute;top:0;bottom:0;left:0;right:0; 然后你不需要視口的確切寬度/高度， div將已經使用了最大可能的空間。

但是如果你仍然想要檢測，jQuery也$(element_you_want).width()和.height() 。 嘗試使用文檔或僅使用正文（高度為100％）

Answer 2

如果您使用的是javascript，請嘗試提醒：'innerWidth';

http://www.quirksmode.org/dom/w3c_cssom.html

Answer 3

自己回答：

var $div = $( '<div></div>' ).appendTo( document.body );

$div.css({height:2000,width:2000});

setTimeout(function(){
    window.scrollTo(0,1);
    alert( window.innerHeight + ', ' + window.innerWidth );
}, 10);

基本的想法是我強制窗口比我知道它可以支持的大，刪除地址欄然后測量大小。 我現在可以適當地調整這個div的大小。