मैं jQuery (या तो स्क्रॉलिंग या ट्रिगर किए गए एनीमेशन द्वारा) पीएनजी अनुक्रम के बावजूद कैसे एनिमेट कर सकता हूं

Question

अधिक से अधिक मुझे एक प्रभाव दिखाई दे रहा है जहां पीएनजी को डीवीवी (या एक div) की श्रृंखला में लोड किया जाता है और फिर फ्रेम द्वारा फ्रेम के अनुसार अनुक्रमित किया जाता है या तो बटन क्लिक या स्क्रॉल पर आधारित के आधार पर। मैंने कोड पर ध्यान देने की कोशिश की है, और मैं समझता हूं कि जावास्क्रिप्ट भारी भारोत्तोलन कर रहा है, लेकिन मैं अभी भी थोड़ा खो गया हूं, क्या इस तकनीक पर कोई ट्यूटोरियल है? उदाहरण?

एनीमेशन के उदाहरण (कई div) http://atanaiplus.cz/index_en.html: एनीमेशन (एक div) की

उदाहरण: http://www.hyundai-veloster.eu/

स्क्रॉल एनीमेशन के उदाहरण: http://discover.store.sony.com/tablet/#design/ergonomics

Answer 1

तुम सिर्फ बाहर स्वैप करना चाहते हैं एक setInterval टाइमर

var myAnim = setInterval(function(){ 
    $(".myImageHolder").attr('src', nextImage); 
}, 42); 

का उपयोग कर स्रोत विशेषता

चाल यह है कि आप nextImage कैसे उत्पन्न करते हैं। यह काफी हद तक अपने चित्रों के नामकरण सम्मेलनों पर निर्भर करता है, या किस दिशा आप एनीमेशन इच्छा विभिन्न छवियों के बीच स्विच करने की शायद में

अद्यतन

चलाने के लिए या एक plugin

Answer 2

का उपयोग करने के बजाय, का उपयोग इस प्रश्न में वर्णित स्प्रेटिंग तकनीक: How to show animated image from PNG image using javascript? [ like gmail ]