• Đăng ký
  • Đăng nhập

Lazy Load Image đơn giản bằng javascript (không dùng jquery)

📅 — 👀 213 — 👦

Trang này có hữu ích không?

👍 Có (11)        👎 Không (10)


Dưới đây là code để tải hình ảnh mượt mà, làm cho chúng tôi cảm thấy trang web tải nhanh và đẹp, điều này giúp seo tốt hơn. Người dùng sẽ thấy web load nhanh hơn nên sẽ không thoát website của bạn nếu chờ web load quá lâu.

Result

[html]<img data-src='https://4.bp.blogspot.com/-yTXftgTCWO8/Wl2t34i8aQI/AAAAAAAACS0/MJm8XTb0Eh4lB9zVo1_zYFOsJEfsixLWwCLcBGAs/s1600/banner-thichcode.jpg'/>[/html][js]<script>
[].forEach.call(document.querySelectorAll('img'), function(img) {
var src = img.getAttribute('data-src');
if (src !== null) {
img.setAttribute('data-src', src);
img.onload = function() {
img.removeAttribute('data-src');
};
img.src = img.getAttribute('data-src');
}
});
</script>[/js]

Trả lời


📁 Chưa được phân loại, Code Demo
🔖