在前端判断 iPhone -4 与 iPhone -5 的办法

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 3833 天前的主题，其中的信息可能已经有所发展或是发生改变。

为iphone-4与5做了两套图，想各自加载不同的<img src>, 在前端有什么办法区分这两者吗？在后端通过user-agent可以判断，但感觉不是特别好的办法，增加了后端的逻辑。

第 1 条附言 · 2014-05-09 14:42:10 +08:00

谢谢各位，window.screen.height来判断，解决问题
+ $(window).ready(function() {
+ var height = window.screen.height;
+ console.log(height);
+ if (height <= 480) {
+ console.log(height);
+ $('#slide_00').attr("src", "img/4000.png")
+ $('#slide_01').attr("src", "img/4001.png")
+ $('#slide_02').attr("src", "img/4002.png")
+ $('#slide_03').attr("src", "img/4003.png")
+ }
+ });

iPhone

前端

办法

9 条回复 • 2014-05-09 13:01:09 +08:00

qdvictory

2014-05-09 11:50:16 +08:00

是判断ip还是判断页面高度？

luo123qiu

2014-05-09 11:55:24 +08:00

根据窗口高度来判断吧。

jsonline

2014-05-09 11:57:05 +08:00 via Android

iPhone 负4？

NemoAlex

2014-05-09 12:00:03 +08:00

navigator.userAgent
iPhone 4 和 5 这个有区别么？

jiangpeng

2014-05-09 12:10:00 +08:00

userAgent 只会知道是 iPhone 还是 iPad，还是得窗口高度啊

kamal

2014-05-09 12:40:21 +08:00

iPhone 4 UA
Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_0 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version/4.0.5 Mobile/8A293 Safari/6531.22.7

iPhone 5 UA
Mozilla/5.0 (iPhone; CPU iPhone OS 5_0 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9A334 Safari/7534.48.3

iPhone OS 4_0
iPhone OS 5_0

jiangpeng

2014-05-09 12:42:13 +08:00

@kamal 这是 iOS 的版本吧……

kamal

2014-05-09 12:59:56 +08:00

@jiangpeng 是我搞错了
http://www.darianshimy.com/blog/2013/01/18/javascript-iphone-4-slash-5-detection/
这里有解决方法。

iamocean

2014-05-09 13:01:09 +08:00

window.screen.height > 480 ? iphone5 : iphone4;