如何识别屏幕尺寸

我正在研究一些移动网络应用程序（ 它是我的第一次 ），我遇到了这样的问题：尽管使用了特殊的移动框架，但某些尺寸的模态窗口在小屏幕上是不正确的。 例如我有一个ipod和ipad：

在iPod上，按钮的大小已经改变了一点。 所以，可能有任何方法来识别屏幕大小， 如类别（小，正常，大或可能只是得到数组的大小列表）使用js可能然后基于它我会在源中做一些基本的更改。

Answer 1

使用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 } } 

Answer 2

您可以使用jquery获取屏幕高度宽度

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

您没有像小型，大型等那样获得尺寸规格。

您已使用屏幕宽度和高度自行编写响应代码。

Answer 3

我强烈建议使用css media-queries而不是基于js识别js中的宽度和服务样式表。

CSS媒体查询是标准化的： http ： //www.w3.org/TR/css3-mediaqueries/

另请参阅示例和用法： http ： //css-tricks.com/css-media-queries/