JS 34 - 实作 Medium 的渐进式图片载入效果

大家好！

各位知道 Medium 的图片载入效果吗？
就是先模糊图片，等到载入完成再将图片转为清晰的那个效果。
我们今天就是要实作这个。

程序码

window.addEventListener('load', function () {
    const imgs = Felix('img');
    Felix.forEach(imgs, function (img) {
        img.src = img.dataset.src;
        img.addEventListener('load', function () {
            this.classList.add('loaded');
        });
    });
});

实测

范例连结制作中。

差不多也到尾声了。
如果对文章有任何疑问，也欢迎在下方提问和建议！
我是 Felix，我们明天再见！