根据屏幕尺寸确定设备？

Question

我想要一个主要的桌面网站，并且能够重定向到移动和电视网站。 我在移动网站上在线找到了一些代码，但不确定如何在电视上使用。 这是手机版：

<script type="text/javascript">
if (screen.width <= 699) {
document.location = "index-mobile.html";
}
</script>

我对电视的想法是screen.width >= 1280 （720p的标准宽屏宽度），但是即使最小的计算机屏幕也将包括在其中。 有没有一种方法可以在不使用用户代理的情况下很好地做到这一点，因为我想包括所有游戏机，机顶盒，智能电视等，而我无法获得每个用户的代理。 我考虑过做screen.height == 720 or screen.height == 1080 ，但这将包括一些显示器，但不包括一些国际电视。

Answer 1

您可以使用以下方法来实现目标：

http://modernizr.com/

Modernizr是一个功能检测库。 通常，与设备检测相比，实现特征检测是更好的做法。

我建议您不要使用屏幕的高度和宽度，因为存在很多可能性。 如果您重新考虑基于功能进行区分的方法，则可以依靠Modernizr这样的层来为您处理复杂性。

例

这是使用媒体查询的Modernizr示例：

if(Modernizr.mq("only handheld") === true){
  //Redirect to mobile site
}else if (Modernizr.mq("only tv") === true){
  //Redirect to TV
}else{
  //Anything else to the desktop
}

这是媒体查询参考。 我不确定我使用的媒体查询是否支持，但是如果您在下面看一下，也许可以为您完成这项工作。

https://developer.mozilla.org/zh-CN/docs/CSS/Media_queries

Answer 2

最近，我不得不处理类似的问题，以处理移动设备上的屏幕尺寸。 51Degrees.mobi具有可处理屏幕尺寸检测的开源Java解决方案。 该API非常易于实现，并且在此处提供了指南。 我基本上在他们的指南中修改了代码以处理屏幕尺寸：

public static void main(String[] args) {
    Provider p = null;
    try {
        p = Reader.create();
    } catch (BinaryException e) {
        e.printStackTrace();
    }

    BaseDeviceInfo b = p.getDeviceInfo("ENTER USERAGENT HERE");
    String width = b.getFirstPropertyValue("ScreenPixelsWidth");
    String height = b.getFirstPropertyValue("ScreenPixelsHeight");
}

这将为您提供x和y屏幕分辨率值，您可以随后使用它们。 我相信他们的高级版本可以检测电视/控制台。 希望这可以帮助。