如何识别屏幕尺寸(How to identify screen size)

2019-10-17 04:35发布

我对一些移动Web应用程序的工作( 是我的冷杉时间 ),我就面临这样的问题:尽管使用了特殊的移动框架模态窗口的某些尺寸不小屏幕上是正确的。 比如我有一个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:

我强烈建议,而不是使用识别JS宽度和服务基于该样式表CSS媒体查询。

CSS媒体查询是standradrized: http://www.w3.org/TR/css3-mediaqueries/

另见的例子和用法这里: http://css-tricks.com/css-media-queries/



文章来源: How to identify screen size