MobileSafari 未通过 JavaScript 返回正确的图像大小信息

2023-11-21

我有一个 HTML此问题的测试页在这里。因为某些原因MobileSafari 正在报告Image.width/height任何超过 1700 像素的图像的属性为其值的一半。那就是width例如,JPG 的属性是 2000,但 MobileSafari JavaScript 将其报告为 1000。如果我尝试使用相同的代码处理 1700 像素宽的图像,我会得到正确的宽度。

The test我确实加载了两个图像(不同尺寸的同一图像)并显示 JavaScript 大小值。我尝试过:

  • Chrome 22、Safari 5.1.7、Firefox 15.0.1 均在 Mac OS X 10.6.8 中(正确大小)
  • iOS Simulator 4.3 SDK 3.2(大小不正确)
  • 装有 iOS 5.1 的 iPad 2(尺寸不正确)
  • 装有 iOS 5.1 的 iPhone 4S(尺寸不正确)

有什么想法为什么会发生这种情况吗?我是否缺少某个地方的设置?为什么它适用于某些图像但不适用于其他图像?

测试在这里:http://still-island-1941.herokuapp.com/sizetest.html

这是 JavaScript 代码:

    var imgBig, imgSmall;

    function init() {
        imgBig = new Image();
        imgBig.onload = handleBig;
        imgBig.src = "/images/size.jpg";
        imgSmall = new Image();
        imgSmall.onload = handleSmall;
        imgSmall.src = "/images/test1.jpg";
        document.getElementById("browser").innerHTML = navigator.userAgent;
    }

    function handleBig() {
        document.getElementById("dimensionsBig").innerHTML = imgBig.width + "x" + imgBig.height;
        document.getElementById("testBig").src = imgBig.src;
    }

    function handleSmall() {
        document.getElementById("dimensionsSmall").innerHTML = imgSmall.width + "x" + imgSmall.height;
        document.getElementById("testSmall").src = imgSmall.src;
    }

这是 HTML 代码:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> 
    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    <title>MobileSafari image dimensions test</title>
</head>
<body onload="init()">
    <p>your browser: <strong><span id="browser"></span></strong></p>
    <p>big image dimensions: <strong><span id="dimensionsSmall"></span></strong> (should be 1700x1134)</p>
    <img id="testSmall" />
    <p>small image dimensions: <strong><span id="dimensionsBig"></span></strong> (should be 2000x1334)</p>
    <img id="testBig" />
</body>
</html>

是的,它存在尺寸和重量的限制。

由于 iOS 上的可用内存,它可以处理的资源数量受到限制:

最大尺寸为decoded对于 RAM 小于 256 MB 的设备,GIF、PNG 和 TIFF 图像为 3 兆像素;对于 RAM 大于或等于 256 MB 的设备,GIF、PNG 和 TIFF 图像为 5 兆像素。 也就是说,确保宽*高≤3*1024*1024适用于 RAM 小于 256 MB 的设备。 注意解码后的大小远大于编码后的大小图像的:

最大值decodedJPEG 图像大小为 32 兆像素,使用 二次抽样。 JPEG 图像可达 32 兆像素,因为 子采样,允许 JPEG 图像解码为具有 1 的大小 第十六为像素数。大于 2 兆像素的 JPEG 图像 被二次采样,即解码为减小的尺寸。 JPEG二次采样 允许用户查看来自最新数码相机的图像。

对于具有以下功能的设备,画布元素的最大尺寸为 3 兆像素 小于 256 MB RAM 和 5 兆像素的设备 等于 256 MB RAM。画布对象的高度和宽度为 150 x 300 像素(如果未指定)。

一些可能有帮助的链接:

  • 苹果官方网站:检查了解 iOS 资源限制部分
  • 分析及解决方法见评论
  • 解决方法

Cheers

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

MobileSafari 未通过 JavaScript 返回正确的图像大小信息 的相关文章

  • 在android中通过BLE传输图像

    我使用以下代码传输 1 MB 的图像 如果在每个数据包之间实现线程延迟 则图像将成功传输 如果未设置线程延迟 则所有数据包均从BluetoothGattServer 发送 但BluetoothGattCallback 不会接收所有数据包 任
  • Angular.js:如何从无序列表中获取 orderBy 或过滤器来工作?

    尝试根据价格和评级 在返回的对象中 进行排序 我宁愿用 ng click 和 li 来代替使用选择菜单 有没有办法做到这一点 我环顾四周 这是我能想到的最接近的 ul class restaurant filter li i class i
  • 使用 Node.js 构建网站的最佳实践

    这个问题的答案是社区努力 help privileges edit community wiki 编辑现有答案以改进这篇文章 目前不接受新的答案或互动 我想知道如何使用 Node js 从头开始 开发一个网站 我明白我怎么能possibly
  • 为什么 window 与 Internet Explorer 中的 window.self 不同?

    关于我如何遇到这个问题有一个复杂的背景故事 但为什么self属性不完全等于窗口本身 在 Safari 和 Firefox 及其朋友中 结果如我所料 gt window window self true gt window window se
  • Number.IsNaN() 比 isNaN() 更糟糕吗

    Soooooo isNaNJavaScript 显然被破坏了 比如 isNaN isNaN isNaN true isNaN false isNaN 0 返回 false 当它们看起来都是 不是数字 在 ECMAScript 6 中 草案包
  • 如何在React Native Android中获取响应头?

    您好 我想在获取 POST 请求后获取响应标头 我尝试调试看看里面有什么response with console log response 我可以从以下位置获取响应机构responseData但我不知道如何获取标题 我想同时获得标题和正文
  • 访问图像的 Windows“标签”元数据字段

    我正在尝试进行一些图像处理 所以现在我正在尝试读取图像 exif 数据 有 2 个内置函数可用于读取图像的 exif 数据 问题是我想读取图像标签 exifread and imfinfo这两个函数都不显示图像标签 Is there any
  • React autoFocus 将光标设置为输入值的开头

    我有一个受控输入 最初显示一个值 我已将该输入设置为自动聚焦 但当我希望它出现在末尾时 光标出现在输入的开头 我知道这可能是因为自动对焦是在值之前添加的 但我不能 100 确定 在输入字段末尾完成光标初始化的最佳方法是什么 var Test
  • 如何使使用 css 调整大小的图像在 IE 中看起来不错?

    当使用 css 宽度 高度或属性宽度 高度缩放图像时 IE6 和 IE7 无法很好地缩放网页中的图像 我不确定它默认使用哪种算法 但这不好 在这些浏览器中缩放时 缩放图像会显示锯齿伪影 幸运的是 有一种方法可以通过简单的 css 规则强制
  • JavaScript 中的 Promise 有什么意义?

    一个承诺是一个 可能现在可用 或将来可用 或永远不可用的值 来源 MDN 假设我有一个想要处理图片的应用程序 图片已加载 例如在算法在后台使用它之后 或某种其他类型的延迟 现在我想检查一下图片是否可以在future 通过使用承诺 而不是回调
  • React Router v4 不渲染组件

    React Router v4 渲染组件存在问题 在应用程序初始加载时 它将呈现与 URL 相对应的正确组件 但是 任何后续的组件Link单击不会呈现所需的组件 图书馆 反应路由器 4 2 2 https reacttraining com
  • JavaScript推送函数中的动态变量

    我在 JavaScript 中使用推送功能 var chartData for var i 0 i lt 3 i chartData push date new Date year s mon s date s hr s min s sec
  • onclick 事件中未调用函数

    我想在每个 YouTube 链接的末尾添加一些 HTML 以在 litebox 中打开播放器 到目前为止 这是我的代码 document ready function var valid url new RegExp youtube com
  • 将 Firebase 云消息传递与 Windows 应用程序结合使用

    我在 Android 和 iOS 应用程序中使用 Firebase Cloud Messaging 但是我还有此应用程序的 Windows Mac OS 版本 我想保留相同的逻辑 我知道 Firebase Cloud Messaging 可
  • Android 相机未保存在特定文件夹 [MediaStore.INTENT_ACTION_STILL_IMAGE_CAMERA]

    当我在 Intent 中使用 MediaStore INTENT ACTION STILL IMAGE CAMERA 时遇到问题 相机正常启动 但它不会将文件保存在我的特定文件夹 photo 中 但是当我使用 MediaStore ACTI
  • 用于选择特定 div 中具有特定类的锚元素的 jQuery 选择器是什么

    我有一些这样的代码 我想选择每个 a 带有类的标签status在 div 中foo div a class status a div 你可以这样做 foo find status a
  • 如何将 PIL 图像转换为 NumPy 数组?

    如何转换 PILImage来回转换为 NumPy 数组 这样我就可以比 PIL 进行更快的像素级转换PixelAccess允许 我可以通过以下方式将其转换为 NumPy 数组 pic Image open foo jpg pix numpy
  • 什么是 WKWebView 中的 WKErrorDomain 错误 4

    fatal error LPWebView encounters an error Error Domain WKErrorDomain Code 4 A JavaScript exception occurred UserInfo 0x7
  • JavaFX ImageView 未更新

    因此 我尝试将图像加载并保存到 imageView 中 其中图像的位置是通过文件浏览器选择的 我已经为此工作好几天了 如果我不能解决这个问题 我就会中风 我已经尝试了我能想到的一切 预先感谢您的帮助 UPDATED 这是我的主要课程 pub
  • 没有输入的 jQuery 日期选择器

    我有一个相当复杂的网络应用程序 我想向其中添加一些日期选择 UI 我遇到的问题是我无法从文档中弄清楚如何真正控制日期选择器的出现方式和时间 不涉及任何表单元素 不 我不会添加秘密表单字段 因此简单的开箱即用方法根本行不通 我希望有人可以提供

随机推荐

  • 指定的 JDK 版本为“2724.0.0.0.0”,最大值为“500.0.0.0.0”

    在安装 Netbeans IDE 最新版本时 我遇到了错误 指定的 JDK 版本为 2724 0 0 0 0 而最大值为 500 0 0 0 0 不确定是什么导致了这个问题 类路径 Java Home 都已正确设置 甚至jdk路径在Netb
  • java.io.StreamCorruptedException:无效的流标头:75720002

    我正在创建一个服务器客户端应用程序 其中服务器将 pdf 文件发送到所有连接的客户端 问题是我收到此错误 我寻找解决方案但找不到任何解决方案 这是错误 java io StreamCorruptedException invalid str
  • Eclipse 中缺少“maven package”菜单项

    我正在使用 Eclipse 3 7 和 m2eclipse 以前我知道有一个菜单条目 maven package 但由于我重新安装了 Ubuntu 所以没有条目 我必须 maven install 才能执行相同的操作 现在我想知道是否可以找
  • uniqid有多独特?

    这个问题其实并不是一个寻求解决方案的问题 而更多的是一个简单的好奇心问题 PHP uniqid 函数有一个更多的熵标志 使输出 更独特 这让我想知道 当 more entropy 为真时和不为真时 该函数多次产生相同结果的可能性有多大 换句
  • Java 类中的 Scala getter 和 setter

    我想创建一个遵循 Scala setter getters 约定的 Java 类 我尝试遵循简单的课程 但它不起作用 public class JavaA private int a 0 public int a return a publ
  • 在 Delphi 2009 中显示 PDF 文件的最佳方式是什么 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 目前不接受答案 我应该使用什么组件在 Delphi 2009 应用程序中显示 PDF 文件 EDIT 我一直在使用PDF阅读器by Synactis 一个非常好的免
  • 我是否正确使用了 Java 7 try-with-resources

    我期望缓冲读取器和文件读取器关闭 并在抛出异常时释放资源 public static Object fromFile String filePath throws FileNotFoundException IOException try
  • 删除 Google App Engine 别名应用程序?

    我最近将 App Engine 应用程序从主 从数据存储迁移到高复制数据存储 这创建了两个应用程序 使用示例应用程序名称 myapp myapp hd myapp appspot com 是 myapp hd appspot com 的别名
  • 如何在 ColdFusion 中的 cfloop 查询中获取动态属性名称

    我在一个cfloop通过查询 我想获取一个属性 但直到运行时我才知道该属性是什么 使用 qryResult MyAttr 失败并显示错误 复杂对象类型无法转换为简单值 执行此操作的语法是什么 这是一个简化的示例
  • 包含有关存储过程参数信息的 SQL Server 系统表是什么?

    包含有关存储过程参数的信息 例如数据类型 名称 长度 是否为空 的 SQL Server 系统表是什么 thanks 您可以查询 sys procedures 和 sys parameters select pr name p from s
  • JQuery event.stopPropagation() 不起作用

    在我的 html 中 我在 li 中嵌入了一个 DragHandle 类的跨度 div class treeView ul class tree li span class dragHandle span Item 1 ul li span
  • 打印 html 页面时的边距

    我使用单独的样式表进行打印 是否可以在设置打印边距的样式表中设置左右边距 即纸张上的边距 你应该使用cm or mm当您指定打印时作为单位 使用像素将导致浏览器将其转换为类似于屏幕上显示的内容 使用cm or mm将确保纸张上的尺寸一致 b
  • python 中的并行性无法正常工作

    我正在使用 python 2 7 在 gae 上开发一个应用程序 一个 ajax 调用从 API 请求一些数据 单个请求可能需要约 200 毫秒 但是当我打开两个浏览器并在非常接近的时间发出两个请求时 它们花费的时间比双倍的 我尝试将所有内
  • 纯 Javascript 中的元素坐标

    假设我在 div 中有一个元素 或任何其他包含元素 或者可能只是在文档正文中 如何获取该元素相对于其容器的 x y 坐标 我需要能够用纯 Javascript 来完成它 The offsetTop and offsetLeft属性是相对于o
  • 如何查看 Boost.Build 调用的 g++ 命令行 (1.33.1)

    我摸不着头脑 试图找出为什么在我的机器上构建 Boost 库时没有生成导入库 更具体地说 构建 DLL 工作正常 但我之前 即在重新安装计算机之前 正确生成了导入库 一些规格 升压1 33 1 适用于 Windows 的 g 4 3 3 T
  • 为什么 ES6 类中的“this”不是隐式的?

    我知道 ES6 解决了很多存在的问题thisES5 中的关键字 例如箭头函数和类 我的问题涉及this在 ES6 类的上下文中以及为什么必须显式地编写它 我最初是一名 Java 开发人员 在我的世界里 下面的代码行是非常自然的 class
  • 在另一个进程中从内存执行一个进程?

    我想要一个小型的 应用程序加载器 程序 它通过 TCP 从外部服务器接收其他二进制应用程序文件并运行它们 我可以通过将传输的文件保存到硬盘并使用 system 调用来运行它来做到这一点 但是 我想知道是否可以从内存启动新应用程序而不接触硬盘
  • 为什么 memset 采用 int 而不是 char?

    为什么memset采取一个int作为第二个参数而不是char 然而wmemset需要一个wchar t而不是类似的东西long or long long memset早于 相当多 将函数原型添加到 C 中 没有原型 您can t pass
  • 为什么 xdebug 无法与 NetBeans 建立连接?

    我尝试将 xdebug 与 NetBeans 结合使用来调试 PHP 我开始调试 NetBeans 永远等待与 xdebug 的连接 我的 Mac 上安装了 NetBeans 6 8 最新版本 和最新的 MAMP 软件包 我的 php in
  • MobileSafari 未通过 JavaScript 返回正确的图像大小信息

    我有一个 HTML此问题的测试页在这里 因为某些原因MobileSafari 正在报告Image width height任何超过 1700 像素的图像的属性为其值的一半 那就是width例如 JPG 的属性是 2000 但 MobileS