स्टाफ़ gif एनीमेशन शुरू करें जब तक कि यह पूरी तरह से लोड नहीं हो जाता है

Question

मेरे पास एक वेब पेज पर एक बड़ी gif एनीमेशन है और इसे तब तक शुरू करना नहीं है जब तक कि यह पूरी तरह लोड हो जाए। जावास्क्रिप्ट/jQuery का उपयोग करके यह कैसे संभव होगा?

Answer 1

उपयोग एक प्लेसहोल्डर छवि, और एनिमेटेड साथ बदलें एक बार है कि GIF GIF पूरी तरह लोड हो:

<img id="anim" src="placeholder.gif"> 

जे एस:

var myanim = new Image(); 
myanim.src = '/img/actions.png'; 
myanim.onload = function() { 
    document.getElementById('anim').src = myanim.src; 
}​ 

http://jsfiddle.net/mblase75/6XTg7/

Answer 2

आप सीएसएस के साथ किए गए GIF छिपा कर सकते हैं (या जे एस एक प्लेसहोल्डर के साथ उन्हें जगह) और जब GIFs लोड किए गए हैं आप सक्रिय कर सकता है शो()

$('img[src$=".gif"]').load(function(){$(this).show())

Answer 3

आपके पास जावास्क्रिप्ट के माध्यम से gif एनीमेशन पर कोई नियंत्रण नहीं है, इसलिए आपको किसी प्रकार का हैक लागू करना होगा। आपको शुरुआत में इसे छिपाना होगा। वास्तविक तस्वीर के बजाय आप वास्तविक चित्र के आयामों और "प्रतीक्षा" जैसे पाठ के साथ एक div डाल सकते हैं।

जब ब्राउज़र में छवि डाउनलोड की जाती है तो आप छवि के साथ div को प्रतिस्थापित कर सकते हैं। और उस समय एनीमेशन

Answer 4

शुरू हो जाएगा जब तक कि यह पूरी तरह से लोड नहीं हो जाता है।

<!--- this uses jquery !--> 

<script type="text/javascript"> 

    var image_url = "http://media.tumblr.com/tumblr_m4doax3R071r9c1z7.gif"; 

    var image = $('<img />').load(function(){ 

     $(this).show(); 

    }).attr('src', image_url).hide(); 

    $('body').append(image); 

</script> 

यहां मुद्दा यह है, कि एक बार छवि डाउनलोड किया गया है (यानी यह ब्राउज़र कैश में है) है वहाँ वास्तव में एक विशेष फ्रेम से यह शुरू करने की किसी भी तरह से होना करने के लिए प्रतीत नहीं होता।