Lazy load images/Отложенная загрузка картинок
1 2 3 4 5 6 7 8 9 10 11 12 13 |
let images = $('div.images img') $.each(images, function( i, img ){ let src = $(img).data('src'); // check if img set if(src.length == 0){ return; } // show image $(img).attr('src', src); }); |
example
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
function lazyLoaderReady() { let banners = $('.slider_banner .slider_banner_item a img[data-src]'); if (banners.length !== 0) { lazyShowImages(banners); } let slidersWithProducts = $('.itemSlider div li a .itemImg img[data-src]'); if (slidersWithProducts.length !== 0) { lazyShowImages(slidersWithProducts); } } lazyLoaderReady(); function itemsInCategory() { let products = $('#products-list-view .items .item li a .itemImg img[data-src]'); if (products.length > 0) { lazyShowImages(products); } } function lazyShowImages(images) { $.each(images, function( i, img ){ let src = $(img).data('src'); console.log(src); console.log($(img).attr('data-src')); // check if img set if (src) { if (src.length === 0) { return; } $(img).fadeTo(500,0.30, function() { $(img).attr("src", src); }).fadeTo(500,1); $(img).attr('data-src', null); } }); } |