如何識別屏幕尺寸

我正在開發一些移動web應用程序（它是我的第一個時間），並且我遇到了這樣的問題：儘管使用了特殊的移動框架，但在小屏幕上某些尺寸的模式窗口不正確。比如我有一個iPod和iPad：如何識別屏幕尺寸

iPod iPad

在iPod上按鈕的大小已經改變了一點。所以，可能有什麼方法來確定屏幕尺寸類似的類別（小，正常，大或可能只是得到大小列表的數組）使用JS可能，然後基於它我會做一些基本的變化來源。

2012-08-30 NoNameZ

嘗試screen.height和screen.width http://www.w3schools.com/jsref/prop_screen_height.asp – mattytommo

@mattytommo正如我之前所說的，我需要類似於一個類或數組的大小。 – NoNameZ

使用jQuery找到窗口

$(function() { 
    showWidth($(this).width()); 
    $(window).resize(function() { 
     showWidth($(this).width()); 
    }); 
}); 

function showWidth(wid) { 
    var width = parseInt(wid); 
    if (width < 1440) { 
     //use wider stylesheet 
    } else if ((width >= 901) && (width < 1440)) { 
     //use wide stylesheet 
    } else { 
     //use small stylesheet 
    }  
}

來源

2012-08-30 11:08:58 Sark

什麼平板電腦有901？ – NoNameZ

@NoNamez我使用上述代碼來更改在桌面上查看的網頁樣式表，在您的情況下，您可以放置任何想要使用的屏幕大小。 – Sark

你可以得到屏幕高寬使用jQuery像

alert("Width :"+$(window).width()+" Height :"+$(window).height());

你沒有得到的尺寸規格一樣小，大等

你必須使用屏幕寬度和高度的自己寫代碼響應。

來源

2012-08-30 11:06:35 Hkachhia

我強烈建議，而不是使用識別基於該JS和服務樣式寬度CSS媒體查詢的當前寬度。

CSS媒體查詢是standradrized：http://www.w3.org/TR/css3-mediaqueries/

另見的例子和用法這裏：http://css-tricks.com/css-media-queries/

來源

2012-08-31 13:24:03

如何識別屏幕尺寸

回答

相關問題