2

我已经在两个运行 iOS 6 的独立 iPod touch 设备上重现了这一点。iPhone 似乎没有受到影响,iPad 也没有。

我在我的 Web 应用程序中使用 sprite 文件来存储图像。我现在正在尝试提供视网膜支持,因此我创建了一个单独的视网膜精灵文件,该文件的尺寸是低质量文件的两倍。

似乎 Chrome 和 Safari 都不喜欢显示这个。

我正在执行以下操作: .img { background: url(xx-retina.png) no-resize top left; height: xx; width: xx; display: block }

在体内: <div class='img'/>

标签的类型无关紧要。我指定的背景位置偏移无关紧要。该图像不会显示,但如果我查看调试工具,它似乎已加载。如果我开始裁剪图像,最终它会出现。

有没有人有这方面的信息?

4

3 回答 3

2

我遇到了同样的问题。我已经测试了大型 png-8、png-24 和 gif 图像,它们是否具有透明度并不重要 - 图像不会显示在 iPOD 上。

我也尝试在画布中绘制图像,但它也不起作用。

如果您不需要透明度,您可以将图像设为 jpg - 我使用的最大 jpg 为 14mb,并且仍然可以正确显示。

于 2012-11-21T07:58:00.997 回答
0

我有同样的问题 - 运行 iOS 6 的第 4 代 iPod Touch 不会显示 phonegap 页面的背景图像。由于我仍然希望较大/高分辨率的设备使用高分辨率图像,所以我所做的是使用媒体查询来更改较小屏幕的背景图像。

@media (max-width: 500px) {
    #login {
        background: url(../../splash/640-960.png);
    }
}

对于 OP,您需要使用类似的媒体查询并将图像类设置为使用较小/原始图像:

@media (max-width: 500px) {
    .img {
        background: url(xx-non-retina.png) no-resize top left; 
    }
}

我选择了 500px 的最大宽度,因为第 4 代 iPod Touch 的有效分辨率为 320w x 480h,因此横向屏幕宽度将为 480px。

于 2013-08-13T13:10:06.593 回答
0

同样的问题发生在我身上。我使用大图像作为网站开头部分的背景。在 iPad 和 iPhone 上,它工作得很好。在 iPod 上,图像根本没有加载。这么奇怪!我已经用大量图像完成了更复杂的网站,但从未遇到过这个问题。

于 2013-01-10T12:35:57.030 回答