0

我正在尝试添加一些需要在 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 解决方案都在那里。任何帮助将不胜感激

4

2 回答 2

1

确认您无法通过媒体查询或用户代理获得任何差异,我发现使用WebGLjs的iPad3iPad4之间存在差异。

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

iPad3 返回2, iPad4 返回16

我想这是由于他们不同的GPU。

演示

<!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>
于 2015-02-23T10:32:14.947 回答
1

使用媒体查询或用户代理不会有任何区别:

  • 媒体查询是一样的
  • 用户代理只包含iPad单词,不包含版本。UA 中的其他信息是关于iOSSafari浏览器。iPad3默认iOS6,但可以更新新版本。Safari取决于iOS版本,因此系统和浏览器信息不准确。

所以只有javascript+iOS特征检测like was with iPadandiPad2的区别,而andevent.acceleration的特征没有区别。iPad3iPad4

所以你不能iPad3只检测。可能是您在这里发布问题,iPad3我们可以帮助您解决它吗?

但:

如果你使用WebView组件,你可以在里面做。您可以通过systemInfo.machine字符串检测Objective-C:

NSString *machineName = [NSString stringWithCString:systemInfo.machine encoding:NSUTF8StringEncoding];

machineNameiPad3 是iPad3,1,iPad3,2iPad3,3. iPad4iPad3,4iPad3,5并且iPad3,6(不要问为什么:)

并且WebView您可以iPad3.css使用WebResourceLoadDelegate例如将您的 css 文件更改为。

于 2014-01-24T12:46:50.237 回答