我想为iPhone 4用户加载更高分辨率的图片,但我知道检测用户的唯一方法是由用户代理。但我的印象是,任何iOS4手机上的MobileSafari用户代理都是一样的。
如何检测iPhone 4?
答案 0 :(得分:3)
您可以使用CSS3媒体查询来检测iPhone 4的设备像素比(有多少CSS像素等于物理显示像素)。然后,您可以使用CSS来加载更高分辨率的图像而不是正常的图像。
在网页上的<head>
标记中,添加此标记以引用仅为iPhone 4用户加载的外部样式表:
<link rel="stylesheet" type="text/css" href="high_res.css" media="only screen and (-webkit-min-device-pixel-ratio: 2)" />
media
属性指定仅将此样式表用于设备像素比率最小为2的设备(即iPhone 4)。然后,您可以在high_res.css中添加CSS规则,以使用高分辨率版本替换低分辨率图像:
#highres-if-possible {
background-image: url(high_res_pic.png);
}
请注意,您必须使用CSS background-image
属性而不是src
属性在HTML中指定图像。
示例:对于60x50图像,请替换:
<img id="highres-if-possible" src="low_res_pic.png">
与
<img id="highres-if-possible" style="width: 60px; height: 50px; background-image: url(low_res_pic.png);">
不能保证指定这样的图像可以在所有浏览器(Internet Explorer)中使用,但它应该在符合标准的浏览器(以及iPhone)上正常工作。
有关CSS3媒体查询的更多信息并使用它们来检测iPhone 4,请参阅:http://blog.iwalt.com/2010/06/targeting-the-iphone-4-retina-display-with-css3-media-queries.html
更新:我遇到了 this post 和this post,可能有更好的方法来处理使用CSS指定图像(使用{{ 1}}而不是<img style="background-image:url(http://...)">
),而不是我上面的。{/ p>
答案 1 :(得分:-1)
使用HTTP_USER_AGENT字符串,您可以找出它是哪一个。我从来没有尝试过,但是如果能让你开始的话。我也见过几个php库,它会为你做。希望这可以帮助。 欢呼声。