تخطيط" المدونة
انقر على "تحرير HTML" للقالب الذي تريد تطبيق التحميل الكسول عليه
ابحث عن الوسم <head> في القالب
قم بإضافة الكود التالي داخل الوسم <head>:
<script>document.addEventListener("DOMContentLoaded", function() {var lazyloadImages = document.querySelectorAll("img[data-src]");var lazyloadThrottleTimeout;function lazyload() {if(lazyloadThrottleTimeout) {clearTimeout(lazyloadThrottleTimeout);}lazyloadThrottleTimeout = setTimeout(function() {var scrollTop = window.pageYOffset;lazyloadImages.forEach(function(img) {if(img.offsetTop < (window.innerHeight + scrollTop)) {img.src = img.dataset.src;img.removeAttribute('data-src');}});if(lazyloadImages.length == 0) {document.removeEventListener("scroll", lazyload);window.removeEventListener("resize", lazyload);window.removeEventListener("orientationChange", lazyload);}}, 20);}document.addEventListener("scroll", lazyload);window.addEventListener("resize", lazyload);window.addEventListener("orientationChange", lazyload);});</script>
حفظ التغييرات وقم بتحديث مدونتك
هذا الكود يضمن أن الصور التي تحتوي على الخاصية data-src ستحمل فقط عندما تصبح مرئية داخل نطاق العرض. تذكر أنه يجب أن تكون متأكدًا من أن الصور التي تريد تطبيق التحميل الكسول عليها تحتوي على الخاصية data-src بدلاً من src
0 التعليقات : :
إرسال تعليق