- 给所有img标签加上 lass="lazyload" data-src="真实地址" src="可以不填写"
<img class="lazyload" data-src="{% static 'image/background_img/425df94c8200a73383cd40212d7f7a2.jpg' %}" src="" alt="">
2.引入 lazyload.js
<script src="https://cdn.jsdelivr.net/npm/lazyload@2.0.0-beta.2/lazyload.js"></script>
3.在script标签中写入以下js代码
window.onload=function(){
lazyload();
}
// IE浏览器不支持懒加载
var userAgent = window.navigator.userAgent;
if(userAgent.indexOf('NET') != -1) {
//如果是IE浏览器则让data-src的值等于src
$('img').each(function () {
var data_src = $(this).attr('data-src');
if(data_src){
$(this).attr('src', data_src)
}
})
}else{
window.onload=function(){
lazyload();
}
}
