आलसी लोड छवियां जब वे व्यूपोर्ट में आती हैं

Question

मैं हाल ही में ब्लॉग/वेबसाइटों पर आ रहा हूं जो दृश्यमान दृश्य में स्क्रॉल किए जाने पर ही छवियों को लोड करते हैं। फिर यह उन्हें फेंक देता है। क्या कोई jQuery है ... यहां तक ​​कि वर्डप्रेस प्लग-इन भी ऐसा करता है?

उदा। http://icodeblog.com

Answer 1

जावास्क्रिप्ट के बारे में अच्छी चीजों में से एक है आप स्रोत देख सकते हैं और क्या हो रहा है इसे देख सकते हैं।

http://www.appelsiini.net/projects/lazyload

Answer 2

LazyReady: स्रोत को देखने के बाद मैं इस पाया http://plugins.jquery.com/project/LazyReady

Answer 3

आप मुझे लगता है कि आलसी लोड करने के लिए एचटीएमएल टिप्पणियों का उपयोग करता है लिखा था इस jQuery प्लगइन कोशिश कर सकते हैं एचटीएमएल के किसी भी मनमाने ढंग से बिट्स, छवियों सहित:

jQuery Lazy Loader Blog Post

jQuery Lazy Loader Plugin Page

<pre class=”i-am-lazy” ><!– 
    <img src=”some.png” /> 
–></pre> 

<pre class=”i-am-lazy” ><!– 
    <div>Any, html css img background, whatever. <img src=”some.png” /> </div> 
–></pre> 

<script type=”text/javascript” src=”jquery.lazyloader.js” ></script> 
<script type=”text/javascript” > 
$(document).ready(function() 
{ 
    $(’pre.i-am-lazy’).lazyLoad(); 
}); 
</script> 

तो बुनियादी तौर पर आप एक प्लेसहोल्डर टैग और और भीतरी एचटीएमएल टिप्पणी के साथ आलसी लोड करने के लिए सामग्री आप चाहते हैं लपेट:यहाँ एक उदाहरण है। जब प्लेसहोल्डर व्यूपोर्ट में दिखाई देता है, तो इसे टिप्पणी के अंदर HTML स्ट्रिंग के साथ बदल दिया जाता है।

आप प्लेसहोल्डर के लिए किसी भी टैग का उपयोग कर सकते हैं, लेकिन मुझे पूर्व पसंद है क्योंकि यह केवल 0 टिप्पणी के रूप में प्रस्तुत करता है जब अंदर केवल एक टिप्पणी होती है।

आशा है कि इससे मदद मिलती है! @MW_Collins