एक स्थिर खंड एक फ्लैट छवि की तरह पढ़ता है इसे एक कोमल, लूपिंग बहाव दें और वही तत्व जीवित महसूस करता है फ्लोटिंग प्रभाव में विस्तार एलिमेंट के लिए मास्टर ऐडऑन किसी भी तत्व के लिए उस निरंतर गति को जोड़ता है, लिखने के लिए कोई कीफ्रेम या कस्टम सीएसएस नहीं है यह मार्गदर्शिका बताती है कि एक्सटेंशन क्या करता है, आप क्या चेतन कर सकते हैं, और इसे कैसे लागू करें।
फ्लोटिंग इफेक्ट्स एक्सटेंशन क्या है? #
द फ्लोटिंग प्रभाव एक्सटेंशन एलिमेंट मोशन टूल के लिए एक मास्टर एडॉन्स है जो किसी भी एलिमेंट तत्व, अनुभाग, कॉलम या विजेट में एक निरंतर, लूपिंग एनीमेशन जोड़ता है यह तत्व को एनिमेट करता है अनुवाद करना, घुमाएँ, और स्केल रूपांतरित करता है, और आपको नियंत्रित करने देता है अवधि, देरी, और दिशा आंदोलन के क्योंकि प्रभाव सीएसएस-आधारित है, तत्व भारी जावास्क्रिप्ट एनीमेशन लाइब्रेरी के बिना अपने आप बहता रहता है।
आप क्या चेतन कर सकते हैं #
फ्लोटिंग इफेक्ट्स तीन ट्रांसफॉर्म प्रकारों के माध्यम से काम करता है, और आप गति को आकार देने के लिए उन्हें समय नियंत्रण के साथ जोड़ते हैंः
- अनुवाद करना j, तत्व को X या Y अक्ष, क्लासिक ऊपर-नीचे या साइड-टू-साइड फ्लोट के साथ ले जाता है।
- घुमाएँ in हल्के प्रभाव के लिए तत्व को थोड़ा आगे और पीछे घुमाता है।
- स्केल esl नरम स्पंदन प्रभाव के लिए तत्व को बढ़ाता और सिकोड़ता है।
- अवधि, विलंब और दिशा एक चक्र कितना समय लगता है, यह शुरू होने से पहले कितना इंतजार करना है, और गति किस तरह से चलती है, यह सेट करें, इसलिए एनीमेशन अनुभाग की गति से मेल खाता है।
एलिमेंटर में फ्लोटिंग इफेक्ट्स कैसे जोड़ें #
फ्लोटिंग इफेक्ट्स एलिमेंट संपादक से प्रति तत्व लागू होता है, एक बार मास्टर एडॉन्स में एक्सटेंशन सक्षम हो जाता है संक्षेप में: उस तत्व का चयन करें जिसे आप एनिमेट करना चाहते हैं, इसकी सेटिंग्स खोलें, फ्लोटिंग इफेक्ट्स चालू करें, और इसके समय के साथ एक परिवर्तन चुनें।
- सुनिश्चित करें एलिमेंट के लिए मास्टर ऐडऑन स्थापित और सक्रिय है, और फ्लोटिंग इफेक्ट्स एक्सटेंशन मास्टर एडॉन्स पैनल में सक्षम है।
- एलिमेंटर संपादक में, उस अनुभाग, कॉलम या विजेट का चयन करें जिसे आप एनिमेट करना चाहते हैं।
- तत्व की सेटिंग्स खोलें और मास्टर ऐडऑन ढूंढें फ्लोटिंग प्रभाव नियंत्रण करता है, फिर प्रभाव को चालू करें।
- एक परिवर्तन चुनें अनुवाद करना, घुमाएँ, या स्केल 1 और सेट करें अवधि, देरी, और दिशा.
- लाइव साइट पर तत्व बहाव देखने के लिए पृष्ठ का पूर्वावलोकन करें या प्रकाशित करें।
फ्लोटिंग इफेक्ट्स का उपयोग करने के लिए युक्तियाँ #
- गति को सूक्ष्म रखें। एक छोटी अनुवाद दूरी और एक धीमी अवधि को पॉलिश के रूप में पढ़ा जाता है; बड़ी, तेज़ गति ध्यान भटकाने वाली लगती है।
- प्रति दृश्य एक या दो तत्वों पर इसका उपयोग करें। एक एकल तैरती हुई नायक छवि या आइकन ध्यान खींचता है; गतिमान एक पूरा पृष्ठ स्वयं से प्रतिस्पर्धा करता है।
- इसे प्रवेश गति के साथ जोड़ो। फ्लोटिंग इफेक्ट्स को इसके साथ मिलाएं प्रवेश एनीमेशन विस्तार ताकि कोई तत्व पहले आसान हो जाए, फिर अपना हल्का फ्लोट बनाए रखे।
- मोबाइल पर चेक कर लें। पुष्टि करें कि आंदोलन अभी भी छोटी स्क्रीन पर अच्छा दिखता है और आस-पास की सामग्री को इधर-उधर नहीं धकेलता है।
अक्सर पूछे जाने वाले प्रश्न #
मास्टर ऐडऑन में फ्लोटिंग इफेक्ट्स एक्सटेंशन क्या है?
फ्लोटिंग इफेक्ट्स एलिमेंटर मोशन एक्सटेंशन के लिए एक मास्टर एडॉन्स है जो किसी भी एलिमेंटर तत्व में एक निरंतर, लूपिंग एनीमेशन जोड़ता है यह अनुवाद, घुमाता है, और स्केल ट्रांसफॉर्म का उपयोग करता है और आपको कस्टम सीएसएस या कीफ्रेम लिखने के बिना, आंदोलन की अवधि, देरी और दिशा को नियंत्रित करने देता है।
फ्लोटिंग इफेक्ट्स किस प्रकार का एनीमेशन बना सकते हैं?
यह तीन परिवर्तन प्रकारों का समर्थन करता है: एक तत्व को ऊपर और नीचे या साइड टू साइड स्थानांतरित करने के लिए अनुवाद करें, एक कोमल बैक-एंड-फोर्थ स्वे के लिए घुमाएं, और एक नरम स्पंदन प्रभाव के लिए स्केल करें, आप सटीक गति को आकार देने के लिए समय सेटिंग्स के साथ एक परिवर्तन को जोड़ सकते हैं आप चाहते हैं।
क्या मैं फ्लोटिंग एनीमेशन की गति और दिशा को नियंत्रित कर सकता हूं?
हाँ प्रत्येक प्रभाव अवधि, देरी, और दिशा नियंत्रण को उजागर करता है अवधि सेट करता है कि एक चक्र कितना समय लेता है, देरी सेट करता है कि गति शुरू होने से पहले कितनी देर तक इंतजार करना है, और दिशा सेट करता है कि एनीमेशन किस तरह से चलता है, ताकि आप अनुभाग की गति से फ्लोट का मिलान कर सकें।
क्या फ्लोटिंग इफेक्ट्स किसी एलिमेंट तत्व पर काम करता है?
हाँ। एक्सटेंशन एलिमेंटर अनुभागों, कॉलमों और विजेट्स पर लागू होता है, इसलिए आप एक छवि, एक आइकन, एक शीर्षक, एक बटन या एक संपूर्ण अनुभाग फ़्लोट कर सकते हैं। मास्टर ऐडऑन पैनल में एक्सटेंशन चालू होने के बाद आप इसे एलिमेंटर संपादक से प्रति तत्व सक्षम करते हैं।
क्या फ्लोटिंग एनिमेशन मेरी वेबसाइट को धीमा कर देंगे?
प्रभाव सीएसएस-आधारित है, इसलिए यह भारी जावास्क्रिप्ट एनीमेशन पुस्तकालयों की तुलना में हल्का है पृष्ठों को सुचारू रखने के लिए, प्रति दृश्य केवल एक या दो तत्वों पर इसका उपयोग करें और एक बार में पृष्ठ पर सब कुछ एनिमेट करने के बजाय आंदोलन को सूक्ष्म रखें।
