获得真实设备的屏幕尺寸

Question

获取真实设备的屏幕尺寸时遇到问题.看看jsfiddle:http://jsfiddle.net/glenswift/CpBkU/

调整输出框的大小会导致h1文本发生更改.我知道h1的不同部分的像素大小,所以它在桌面上正常工作.但是在具有大dpi和小屏幕的设备上,我的解决方案不起作用,文本消失了.

我不知道如何解决这个问题.我见过simular问题(1,2),但他们不帮我.

我的代码:

function setPositions(){
    var W = $(window).width(),
        h1 = '';
    if (W < 210) {
        h1 = 'Hello';
    } else if (W < 270) {
        h1 = 'Hello World';
    } else {
        h1 = 'Hello World Text'
    }
    $('h1').empty().text(h1);
}
$(document).ready(function(){
    setPositions();
});
$(window).resize(function(){
    setPositions();
});

非常感谢.

Answer 1

关于媒体查询的另一件事http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/

这真是一篇很棒的文章让我开心了:)

请享用!