HTML5 + JS 能不能拿到屏幕尺寸?

[StackGao]

需求是判断客户端是手机则推广手机app,客户端是平板则推广平板app,所以只拿到分辨率区分不出来. 如果用UA判断的话,市面上山寨pad太多了根本统计不过来. 谢谢大家

[已解决] 找到了一个歪门邪道... UA里如果同时有android和mobile两个字段则一定是手机,如果缺了一个就一定是android pad! 进而推广不同的app,希望可以帮到更多人.


@patr0nus
@akeyz
@abelyao
@leer561
@rayps
@learnshare
@anjianshi

谢谢各位的帮助,受教了!

[hackwjfz]

http://www.cnblogs.com/lf6112/archive/2011/07/26/2117348.html

希望能帮到你

[StackGao]

@hackwjfz 这个只能拿到分辨率,拿不到PPI就没办法知道是不是平板.... 不过还是很感谢

[hackwjfz]

@StackGao

soga。。
不好意思

[patr0nus]

@StackGao window.devicePixelRatio 可以拿到缩放比例，不知道有没有用

[akeyz]

https://github.com/tobie/ua-parser

试试这个，看看行不行

[abelyao]

现在很多手机的分辨率，比两年前小尺寸的平板的分辨率都要高了，当然是指物理分辨率，所以物理分辨率已经不能用来判断 phone 或者 pad 了。
但是可以用渲染分辨率来判断，比如拿 iPhone 来说，4 到 5s 都是物理分辨率 ÷ 2，也就是 320 像素的宽度，4 之前就直接是 1:1 的比例。
而到底宽度多少，比例多少，是可以在 head 的 viewport 中设置的，几句话也说不清楚，楼主看看 http://www.cnblogs.com/2050/p/3877280.html 这一类相关帖子吧

[leer561]

这两天正在做，遇到了部分问题
//屏幕适配
var ratio1 = 1/window.devicePixelRatio;
var ratio = ratio1.toFixed(3);
var highResSplash = "<meta name='viewport' content='initial-scale="+ratio+"' />";
$('head').append(highResSplash);

iphone,pad什么的都没问题，而且因为ios7不支持width=device-width，以及安卓4.4之后，不再支持target-densitydpi后，一般我都直接缩放了，至少比那些不努力只会放initial-scale=1.0要好一些。

另外，用phonegap打包，安卓4.4会有viewport缩放实效的问题，需要重新设置webview，不过我已经折腾半天也没把cordova-webview-setting 弄进去。
https://github.com/gitawego/cordova-webview-setting
暂时性放弃，按照360的搞了

[leer561]

sorry，回答错了，完全没应对楼主问题

[rayps]

http://mydevice.io

[learnshare]

1. 永远不要判断设备和浏览器！

2. 用 mediaquery 做相应页面，去适应不同的分辨率；
3. 用 js test(如 if(document.querySelectorAll()))测试浏览器对函数的支持情况，来做向下兼容

[anjianshi]

@learnshare 审题啊，楼主是要根据设备决定推广哪种 APP

[learnshare]

@anjianshi 我是针对标题的，嗯