iPad/iPhone 预加载图像时出错
我在预加载图像和加载时设置内容时遇到了一些问题。我使用 onLoad （或 jQuery $("img").load()-thingy）事件来检测图像何时加载。这在大多数浏览器中都可以正常工作，除非我在 iPad/iPhone 上尝试。不知何故，它只是抛出 onError 事件（该事件没有任何关于错误是什么的描述！）。但是当我在 onError 事件中重定向到图像时，它显示得很好。非常奇怪，似乎无法弄清楚是什么原因造成的。
一些代码：
if( !limg ) {
var load = function($img) {
setTimeout(function() {
var src = $img.attr("src");
video.trigger(filmLoad, [s]);
if (((src.indexOf(url) >= 0 && urlIsString) || !urlIsString)
&& src.indexOf("_low.") >= 0)
{
$img.attr(
"src",
urlIsString
? url.replace("_low.", "_high.")
: set.film.url.high);
still = stillIsString
? still.replace("_low.", "_high.") : set.film.still.high;
}
}, 0);
};
limg = s.loaderimg = $("<img>")
.appendTo(video)
.css({opacity: 0, position: "absolute", left: "-200em"})
.load(function(e) { load($(this)); })
.error(function(e) { if(e.target.complete) { load($(this)); } })
.src("src/to/my/image.jpg");
}
I'm having a bit of an issue preloading an image, and setting up stuff when it is loaded. I use the onLoad (or the jQuery $("img").load()-thingy) event to detect when the image is loaded. This works fine in most browsers, exept when im trying it on an iPad/iPhone. Somehow it just throws the onError event (which has NO description WHAT SO EVER on what the error is!). But when I, in my onError Event, redirect to the image, it shows just fine. Very strange and can't seem to figure out what is causing it.
Some code:
if( !limg ) {
var load = function($img) {
setTimeout(function() {
var src = $img.attr("src");
video.trigger(filmLoad, [s]);
if (((src.indexOf(url) >= 0 && urlIsString) || !urlIsString)
&& src.indexOf("_low.") >= 0)
{
$img.attr(
"src",
urlIsString
? url.replace("_low.", "_high.")
: set.film.url.high);
still = stillIsString
? still.replace("_low.", "_high.") : set.film.still.high;
}
}, 0);
};
limg = s.loaderimg = $("<img>")
.appendTo(video)
.css({opacity: 0, position: "absolute", left: "-200em"})
.load(function(e) { load($(this)); })
.error(function(e) { if(e.target.complete) { load($(this)); } })
.src("src/to/my/image.jpg");
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
如果您使用
.manifest文件，则需要将图像的 URL 放入其中。If you are using a
.manifestfile, you need to put the urls of the images in it.您好，只是回答我自己的问题：
我发现 iPad 在下载图像大小方面有限制，并且由于我的图像非常大（尺寸方面），所以它根本没有下载它们。这些图像实际上是小胶片，高度超过 14000 像素，宽度约为 600 像素。因此，iPad 在加载它们时会抛出错误，然后跳过下载。
我尝试让图像变得更方正，这样图像就不会那么高，但仍然抛出错误。解决方案是将图像分割成更小的块，因为我发现 iPad 允许尺寸约为 600x6000 像素的图像。因此，我将幻灯片分割成尺寸约为 600x4500 像素的较小图像，效果非常好。
总之：如果 iPad 拒绝下载图像，则图像可能太大，无论是字节还是尺寸。
Hi just to answer my own question:
I found out that the iPad has a limit in how large images it will download, and as my images was very large (dimensions wise) it simply didn't download them. The images is actually small filmstrips, with a height over 14000 pixel and a width around 600 pixel. So the iPad threw an error, when loading them and then skipped downloading.
I tried to make the image more square, so that the image wasn't so high, but it still threw an error. the solution was to split the images up into smaller chunks, as i discovered that the iPad allowed images with dimensions around 600x6000 pixel. Therefore i split the filmstrip up in smaller images with dimensions around 600x4500 pixel, which worked pretty well.
So in conclusion: If the iPad refuses to download an image, it might be to big, either byte wise or dimensions wise.