Question

我尝试添加一些需要在iPad 3上执行的CSS，而不是iPad 4或反之亦然。我能够将旧版本的目标定为：

   @media
   only screen and (-webkit-min-device-pixel-ratio: 2),
   only screen and (   min--moz-device-pixel-ratio: 2),
   only screen and (     -o-min-device-pixel-ratio: 2/1),
   only screen and (        min-device-pixel-ratio: 2),
   only screen and (                min-resolution: 192dpi),
   only screen and (                min-resolution: 2dppx) { }

但到目前为止我找不到3到4之间的目标差异。任何css或JS解决方案都在那里。任何帮助将不胜感激

Answer 1

使用媒体查询或用户代理无法获得任何差异：

媒体查询是same
用户代理仅包含iPad个字，而不包含版本。 UA中的其他信息是关于iOS或Safari浏览器。 iPad3默认使用iOS6，但可以针对新版本进行更新。 Safari取决于iOS版本，因此系统和浏览器信息不准确。

因此javascript只有iOS + iPad功能检测与[{1}}和iPad2的{{1}}相同，但功能没有区别event.acceleration和iPad3。

因此，您无法仅检测到iPad4。您可以在这里发布iPad3的问题，我们可以帮您解决吗？

<强> BUT：

如果您使用iPad3组件，则可以在其中执行此操作。您可以在WebView

中按systemInfo.machine字符串检测到

Objective-C:

iPad3的

NSString *machineName = [NSString stringWithCString:systemInfo.machine encoding:NSUTF8StringEncoding];为machineName，iPad3,1和iPad3,2。 iPad3,3为iPad4，iPad3,4和iPad3,5（不要问为什么：）

在iPad3,6中，您可以使用WebView将您的css文件更改为iPad3.css。

Answer 2

确认您无法通过媒体查询或用户代理获得任何差异，我发现使用 WebGL < iPad3 和 iPad4 之间存在差异/ strong>和 js 。

使用EXT_texture_filter_anisotropic及其扩展对象MAX_TEXTURE_MAX_ANISOTROPY_EXT，您可以返回纹理的最大可用各向异性。

IPad3返回 2 ，iPad4返回 16

我想这是因为它们的GPU不同。

Demo

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Anisotropy</title> </head> <body> <p style="font-size: 100px;" id="anisotropy_val"></p> <canvas id="webGLCanvas" width="400" height="400"> </canvas> </body> <script> function check_max_anisotropy() { var canvas = document.getElementById("webGLCanvas"); var gl = canvas.getContext("experimental-webgl"); var ext = ( gl.getExtension('EXT_texture_filter_anisotropic') || gl.getExtension('MOZ_EXT_texture_filter_anisotropic') || gl.getExtension('WEBKIT_EXT_texture_filter_anisotropic') ); if (ext){ var max = gl.getParameter(ext.MAX_TEXTURE_MAX_ANISOTROPY_EXT); } document.getElementById("anisotropy_val").innerHTML = max; } check_max_anisotropy(); </script> </html>

定位iPad 3但不是iPad 4

2 个答案: