显示替代图像，而另一个图像加载

  • Z时代
  • 2024-01-10
  • 分类：问答

我有这样的一个背景图像的DIV：显示替代图像，而另一个图像加载

<div class="carousel-image" 
    style="background: url(img/background.gif) no-repeat center center;"> 
</div>

当我打开我的网页上，有空白背景的一个恼人的第二，而我的大background.gif图像加载。我该如何去做一个快速加载的替代图像，并在background.gif图像准备就绪后立即替换它？

回答：

您有两种解决方案。

  1. 您可以使用图片的延迟加载。对于这个解决方案，看看这个问题在计算器上：Lazy loading images how

  2. 如果您的图片足够小，您可以使用data URI而不是链接到您的图像。这会直接将你的图像嵌入到html代码中，所以没有什么要加载的。以下是关于如何将图像转换为数据URI的说明：http://www.abeautifulsite.net/convert-an-image-to-a-data-uri-with-your-browser/

第一种解决方案可以解答您的问题。第二个不是，但它是解决同样问题的其他解决方案。

以上是 显示替代图像，而另一个图像加载 的全部内容， 来源链接： utcz.com/qa/261545.html

回到顶部