苹果的iPad Mini在很多方面都是iPad 2的小复制品。在JavaScript中,是窗口。navigator对象为Mini和iPad 2暴露相同的值。到目前为止,我为检测差异而进行的测试还没有成功。

为什么这很重要?

由于iPad Mini和iPad 2的屏幕像素相同,但实际尺寸(英寸/厘米)不同,它们的PPI(每英寸像素)也不同。

为了提供友好的用户界面,web应用程序和游戏会根据用户的拇指或手指位置调整某些元素的大小,因此,我们可能想要缩放某些图像或按钮以提供更好的用户体验。

到目前为止我尝试过的事情(包括一些非常明显的方法):

window.devicepixelratio CSS元素宽度,单位为cm CSS媒体查询(如分辨率和-webkit-device-pixel-ratio) SVG图形在类似的单位 在设定的时间内进行各种CSS webkit转换,并使用requestAnimFrame计算呈现的帧数(我希望检测到可测量的差异)

我没办法了。你呢?

更新 谢谢你的回复。我想对那些投票反对检测iPad mini和iPad 2的人发表评论,因为苹果有一个规则。好吧,这是我的理由,为什么我觉得知道一个人用的是iPad mini还是iPad 2真的很有意义。随你怎么解释我的推理。

The iPad mini is not only a much smaller device (9.7 inch versus 7.9 inch), but its form factor allows for a different usage. The iPad 2 is usually held with two hands when gaming unless you're Chuck Norris. The mini is smaller, but it is also much lighter and allows for gameplay where you hold it in one hand and use another to swipe or tap or whatnot. As a game designer and developer myself, I'd just like to know if it's a mini so I can choose to provide the player with a different controlscheme if I want (for instance after A/B testing with a group of players).

为什么?事实证明,大多数用户倾向于使用默认设置,所以当玩家第一次加载游戏时,不要使用虚拟拇指杆,而是在屏幕上放置一些基于点击的控制,这是我和其他游戏设计师希望能够做到的。

所以恕我说,这超出了粗手指/指导方针的讨论,这是苹果和所有其他供应商应该做的事情:允许我们唯一地识别你的设备,以不同的方式思考,而不是遵循指导方针。


当前回答

不幸的是,目前看来这是不可能的: http://www.mobilexweb.com/blog/ipad-mini-detection-for-html5-user-agent

两天前,我在推特上发布了第一个检测到的问题:“是的 确认iPad Mini用户代理与iPad 2相同。” 我收到了成百上千的回答说用户代理 嗅探是一种不好的做法,我们不应该检测特征 设备,等等。 是的,伙计们,你是对的,但这和 这个问题。我需要补充第二个坏消息:没有 客户端技术也不能进行“特征检测”。

其他回答

你总是可以问用户?!

如果用户不能看到按钮或内容,那么就给他们一种自己管理缩放的方法。您总是可以在站点中构建一些缩放按钮,以使内容(文本/按钮)变大/变小。这将(几乎)保证适用于任何iPad当前的分辨率,也可能适用于苹果公司决定的任何未来分辨率。

没有测试,但它可以不播放音频文件并检查平衡,而是收听麦克风,提取背景噪声,并计算其“颜色”(频率图)。如果IPad Mini的麦克风型号与IPad 2不同,那么它们的背景颜色应该有明显的不同,一些音频指纹识别技术可能会帮助你判断使用的是哪台设备。

我不认为这种方法可行,在这种特殊情况下不值得这么麻烦,但我认为指纹识别背景噪音可以用于某些应用程序,例如,当你在建筑物内时,它可以告诉你你在哪里。

我知道这可能是一个低技术含量的解决方案,但由于我们似乎还没有想出任何其他方法。

我假设你已经检查了大多数其他设备,所以我认为以下场景是可能的。

你可以检查所有可能的最流行的设备,需要特殊的CSS/大小,如果它不匹配,要么假设它是iPad mini或简单地问用户?

// Device checks here
...
else {
  // it would probably be better to make this a nicer popup-thing
  var mini = prompt("Are you using a iPad mini? Press yes for a better user experience");
  // Store the result for future visits somehow.
}

我知道这看起来很愚蠢,但如果我们目前无法确定这款设备是iPad mini还是iPad 2,至少该网站在iPad mini设备做这些事情时是可用的。

你甚至可以这样说:

“为了给你最好的浏览体验,我们会检测你的设备类型,根据你的设备定制网站。不幸的是,由于限制,这并不总是可能的,我们目前无法通过使用这些方法来确定您使用的是iPad 2还是iPad mini。

为了获得最佳的浏览体验,请在下面选择您使用的设备。

此选项将被存储,以供将来在此设备上访问该网站时使用。

[] iPad 2 
[*] iPad mini
[] Ancient blackberry device

"

我并不完全了解在Javascript中客户端可以做什么,不可以做什么。我知道你可以得到一个用户的IP,但是可以得到一个用户的mac地址吗?iPad2和iPad mini的这些范围有什么不同吗?

让用户从离地面几千英尺的高空扔下他们的iPad。然后使用内部加速度计来测量iPad达到终端速度所需的时间。更大的iPad阻力系数更大,达到终端速度的时间应该比iPad Mini更短。

下面是一些示例代码,可以帮助您入门。

function isIPadMini( var timeToReachTerminalVelocity )
{
    return (timeToReachTerminalVelocity > IPAD_MINI_THRESHOLD);
}

当苹果不可避免地以不同的形式发布下一代iPad时,你几乎肯定需要重新审视这段代码。但我相信你会继续跟进事情,并为每一个新版本的iPad保持这个hack。

这里的所有解决方案都不是万无一失的(这就是为什么苹果不会发布一款屏幕大小与iPad 2相同但分辨率与iPad Mini相同的iPad)。所以我想到了一个主意:

创建一个宽度为1英寸的div,并将其附加到主体。然后我创建另一个宽度为100%的div,并将其附加到主体:

var div1= $("<div/>").appendTo(document.body).width("1in");
var div2= $("<div/>").appendTo(document.body).width("100%");

jQuery width()函数总是以像素为单位返回值,所以你可以:

var screenSize= div2.width() / div1.width();

screenSize现在以英寸为单位保存应用程序可用的大小(但要注意舍入错误)。你可以用它来放置你喜欢的GUI。此外,不要忘记删除无用的divs。

还要注意,Kaspars提出的算法不仅在用户全屏运行应用程序时不起作用,而且在苹果修补浏览器UI时也会失效。

这不会区分设备,但正如您在编辑中解释的那样,您实际上想知道的是设备屏幕大小。我的想法也不会告诉你确切的屏幕大小,但它会给你一个更有用的信息,实际大小(英寸),你可以用来绘制你的GUI。

编辑: 使用此代码检查它是否在您的设备上实际工作。我没有用来测试的ipad。

var div1= $("<div/>").appendTo(document.body).width("1in").height("1in").css("position", "absolute");
var div2= $("<div/>").appendTo(document.body).width("100%").height("100%").css("position", "absolute");
var width= div2.width() / div1.width()
var height= div2.height() / div1.height()
alert(Math.sqrt(width*width + height*height));

它应该弹出一个窗口与你的屏幕大小英寸。它似乎在我的笔记本电脑上工作,返回15.49,而我的笔记本电脑屏幕销售为15.4英寸。有人能在ipad上测试一下并发表评论吗?别忘了全屏播放。

EDIT2:结果是我测试它的页面有一些冲突的CSS。我修复了测试代码,使其正常工作。你需要的位置:绝对的divs,所以你可以使用高度%。

EDIT3:我做了一些研究,似乎没有办法在任何设备上获得实际的屏幕大小。这不是操作系统能知道的。当你在CSS中使用一个真实的单元时,它实际上只是一个基于屏幕某些属性的估计。不用说,这一点都不准确。