如何在加载时使图像模糊，并在完全加载后使其清晰？

Question

我正在制作一个项目，当有人打开它时，图像应该给他们一个模糊的预览，并在完全加载后向用户显示 iamge。 例如 - 在 Instagram 上，当我们打开应用程序时，它会向我们显示模糊的图像，而在完全加载后，它会向我们显示清晰的图像。 如何使用 javascript 或 jquery 实现相同的功能？

Answer 1

你需要在你的数据库中有一个非常低质量的图像版本（或者如果你直接嵌入它 -> 在你的资产中）。 然后您可以加载较小的图像并使用CSS blur()对其进行模糊处理。

加载完整大小的图像后，您可以隐藏小图像。 为了获得有关如何检查的一些想法，我发现了这个 stackoverflow 线程： 如何创建 JavaScript 回调以了解何时加载图像？

Answer 2

上述答案如何具有绿色勾号，但共享的链接却没有。 这对我来说看起来不对，我很困惑。