jQuery.lazyload是一款非常流行的圖片懶加載插件,它可以減少網頁的加載時間和流量消耗,并且可以提高用戶的體驗。下面我們來看一下如何在選項卡中使用jQuery.lazyload。
// 先引入jQuery和lazyload插件// HTML結構// JS代碼 $(function() { $("img.lazy").lazyload({ effect : "fadeIn" // 圖片加載效果 }); // 切換選項卡時加載圖片 $('.tabs ul li a').click(function(){ var tab_id = $(this).attr('href'); $(tab_id).find('img.lazy').trigger("appear"); }); });
通過上面的代碼,我們就可以在選項卡中實現圖片懶加載功能。需要注意的是,在頁面加載完成后需要手動觸發一次圖片加載,否則插件不會起作用。