Question

我正在开发图片库应用程序..

它从互联网上加载图像..

我正在做的是将图片网址收集到一个数组中并将其绑定到列表视图中。

它的工作正常..但我的问题是图像显示十字标记（'X'），直到加载图像。

我期待的是

显示每个emage的加载图像，直到加载原始图像
如果无法1，我该如何删除十字标记？

Answer 1

一种方法是将src设置为1x1像素透明gif，将尺寸设置为最终图像大小，将背景图像设置为加载图像，然后使用JavaScript加载图像，并onload交换它进入占位符gif

例如

HTML

<img src="images/spacer.gif" alt="Big Image" border="0" id="big_image" style="background-image:url('loading.gif');" width="3396" height="2347" />

JS

var I = new Image();
I.onload = function () {
    document.getElementById('big_image').src = I.src;
};
I.src = 'http://apod.nasa.gov/apod/image/0911/ngc2623_hst_big.jpg';

Answer 2

您无法删除“X”标记，因为这是特定于浏览器的功能。但是，您可以将图像设置为包含加载图像的背景图像。

简单的例子：

<img src="" style="background-image: url(loadingimage.gif)" />

这样，加载器就会显示并在加载完整图像时被屏蔽。

显示“加载”图像，直到在“图库菜单”中加载原始图像 - 都市风格

2 个答案:

例如