screen.width和在不同的API /設備

screen.height不同的值

編輯：也正好與$（ '主體'）的寬度（）和window.outerWidthscreen.width和在不同的API /設備

API 2.3.3 HVGA

之前和旋轉裝置輸出相同的屏幕的寬度（320）

API 3.0 WXGA後

寬度和高度切換每個旋轉例如

開始與屏幕寬度：1 280 screenheight：800 我旋轉90 目前擁有屏幕寬度：800 screenheight：1280

所以如果我想根據尺寸做出輪換一定的變化，並希望針對所有API我該怎麼辦？我需要一個對所有設備都相同的值。

編輯：對於某些東西我需要像素值，而不是百分比。這就是爲什麼我使用Javascript來根據屏幕寬度計算大小。這將工作，因爲屏幕寬度也是像素值，我可以保持事情成比例。但如果有時screen.width給我目前的寬度，而其他人不，我不能使用它...

- >事情是我開始使用滑塊使用絕對佈局，需要像素值的一切。我不想重新實現滑塊，因此我決定使用屏幕寬度動態計算圖像的大小和整個佈局。並用這些值初始化滑塊。

更新

看看這裏是一個類似的方法我想要做的事：

http://ryangillespie.com/phonegap.php#/phonegap.php？ 2011年6月18日的

入門「一屏幕分辨率達到了統治他們」

我也正是這樣例子試過，複製我的代碼粘貼。但它也不起作用。 window.outerWidth與我描述的screen.width（以及JQuery $（'body'）。width（））相同。只要設備沒有旋轉，它就會工作 - 它初始化的很好。但在第一次輪換時，取決於設備，我遇到了問題。在某些情況下，它可以像預期的那樣工作，在其他情況下，它會交換這些值，以便在縱向模式下獲得較大的寬度，而在其他情況下，它可以始終提供固定的寬度和高度，而在其他情況下，它不會旋轉。 ..

來源

2012-02-17 Ixx

巧合的是，我發現這工作：

$(window).resize(function() { 
    updateScaling($('body').width()); 
});

這總是被調用，並傳遞正確的寬度。據我記得它也適用於screen.width

在updateScaling我計算scalingFactor並調整我的元素。

我嘗試了響應式CSS，媒體查詢等，但在某些時候它沒有意義了，因爲我有無論如何重新計算基於當前幻燈片和新寬度的滑塊UL的邊距 - 以及其他東西這需要腳本。所以我用腳本做了一切。

我刪除了window.onorientationchange。

來源

2012-02-18 21:57:20 Ixx

我不知道phonegap如何爲您呈現信息，但對於原生Android應用程序，您通常會爲各種顯示密度和屏幕大小/寬度聲明不同的佈局和圖像資源。請參閱此頁以獲取更多信息：http://developer.android.com/guide/practices/screens_support.html

來源

2012-02-17 19:38:54 jbowes

是的，我知道。但我想使用屏幕的當前寬度（水平）進行某些計算。 – Ixx 2012-02-17 19:44:10

響應式網頁設計技巧。我在博客上提供了一個超級簡單示例以及一本書推薦。

http://simonmacdonald.blogspot.com/2012/01/on-eight-day-of-phonegapping-multiple.html

來源

2012-02-17 19:48:46

我編輯了我的文章：編輯：對於某些東西，我需要像素值，而不是百分比。這就是爲什麼我使用Javascript來根據屏幕寬度計算大小。這將工作，因爲屏幕寬度也是像素值，我可以保持事情成比例。但如果有時screen.width給我目前的寬度，而其他人不，我不能使用它... – Ixx 2012-02-17 19:56:03

是的，我在下面回答，但應該提及我的2.3.5設備的行爲像你的（檢查設備寬度始終像它在肖像模式）。我的Android 3.1設備報告正確的設備寬度/高度，但報告方向「向後」。如下所示使用媒體查詢有助於解決這些問題。 – Libby 2012-02-17 22:06:22

我使用媒體查詢在我的兩個PhoneGap的應用程序。沒有javascript，除了在的情況下出現異常。

例如，「基本」的CSS可能是寬度320和肖像，然後使用CSS的級聯效應:-)添加像塊：

@media屏幕和（最大寬度：480像素）和（方向：縱向）{使東西做大}

@media所有和（最小寬度：800像素）{使東西更大}

有了這樣在我link'd CSS文件查詢（和設備/操作系統/手機版處理方向變化）新佈局自動發生。

注意：我從Simon的博客和他建議的材料中瞭解到了這一切。

來源

2012-02-17 22:01:47 Libby

screen.width和在不同的API /設備

回答

相關問題