如何在加載時使圖像模糊，並在完全加載后使其清晰？

Question

我正在制作一個項目，當有人打開它時，圖像應該給他們一個模糊的預覽，並在完全加載后向用戶顯示 iamge。 例如 - 在 Instagram 上，當我們打開應用程序時，它會向我們顯示模糊的圖像，而在完全加載后，它會向我們顯示清晰的圖像。 如何使用 javascript 或 jquery 實現相同的功能？

Answer 1

你需要在你的數據庫中有一個非常低質量的圖像版本（或者如果你直接嵌入它 -> 在你的資產中）。 然后您可以加載較小的圖像並使用CSS blur()對其進行模糊處理。

加載完整大小的圖像后，您可以隱藏小圖像。 為了獲得有關如何檢查的一些想法，我發現了這個 stackoverflow 線程： 如何創建 JavaScript 回調以了解何時加載圖像？

Answer 2

上述答案如何具有綠色勾號，但共享的鏈接卻沒有。 這對我來說看起來不對，我很困惑。