दुष्ट सीएसएस - शुद्ध CSS3 में एक हॉट न्यू एनिमेशन लाइब्रेरी
CSS3 के लिए धन्यवाद आप वेब पर कुछ पागल एनिमेशन बना सकते हैं। ये कर सकते हैं सभी ब्राउज़रों और पृष्ठ तत्वों पर काम करें नेविगेशन आइटम, ड्रॉपडाउन, टैब को नियंत्रित करने के लिए, आप इसे नाम देते हैं.
वास्तव में आप इन कोड को गतिशील रूप से एनीमेशन टूल का उपयोग करके भी उत्पन्न कर सकते हैं। लेकिन वे पूरी तरह से विकसित एनीमेशन लाइब्रेरी की तुलना में काफी सीमित हैं.
दुष्ट सीएसएस अपनी तरह का सबसे नया पुस्तकालय है। यह मुझे जल्दी याद दिलाता है Animate.cs जो काफी सरल और अल्पविकसित थी, अभी तक बहुत ज्यादा किसी भी वेबसाइट में इस्तेमाल किया जा सकता है.
सभी समर्थित एनिमेशन की सूची के साथ लाइव डेमो के लिए होमपेज पर एक नज़र डालें। इस लेख को लिखने के रूप में मैं गिनती करता हूं स्लाइड से लेकर घुमावों पर 24 कुल एनीमेशन शैलियाँ और स्पंदन / उछल प्रभाव.
इनमें से कई एनिमेशन एक ऑफ-फीचर्स हैं जिनका उपयोग किसी तत्व को देखने (या बाहर देखने) के लिए किया जाता है। स्क्रॉल-टू-व्यू एनिमेशन वाले पृष्ठों के लिए यह आसान है जो विशिष्ट पृष्ठ तत्वों को लक्षित करते हैं.
लेकिन आप भी कर सकते हैं अतिरिक्त पृष्ठ आइटम दिखाने (या छिपाने) के लिए इसका उपयोग करें जैसे ड्रॉपडाउन मेन्यू, सर्च बार, हिडन साइनअप फॉर्म या कुछ और। यहां उन एनिमेशनों की एक छोटी सूची दी गई है जिन्हें आप यहां से ले सकते हैं:
- शेक
- ज़ूम इन / आउट करें
- ऊपर / नीचे स्लाइड करें
- फ़ेड इन आउट
- में / बाहर रोलिंग
- उछाल और पॉप
- परिपत्र रोटेशन में / बाहर
इन सभी एनीमेशन शैलियों को एक एकल उपयोग के लिए डिज़ाइन किया गया है। उन्हें प्रति पृष्ठ और प्रति तत्व कई बार कहा जा सकता है, लेकिन ये दोहराए जाने वाले एनिमेशन नहीं हैं.
इसके बजाय आप उपयोगकर्ता के क्लिक, होवर या स्वाइप प्रभाव के आधार पर इनका उपयोग करेंगे। उनका उपयोग CTA बटन पर स्पंदन / थ्रोबिंग प्रभाव के लिए भी किया जा सकता है, लेकिन इसके लिए जावास्क्रिप्ट टाइमिंग फ़ंक्शन की आवश्यकता होती है.
लाइव पूर्वावलोकन और कुछ और विवरणों के लिए उदाहरण पृष्ठ पर एक नज़र डालें। आपको GitHub रेपो के साथ मुख्य साइट पर पूर्ण प्रलेखन भी मिलेगा.
दुष्ट सीएसएस एक नया पुस्तकालय है, इसलिए इसका अभी तक कोई बड़ा अनुसरण नहीं हुआ है। लेकिन पुस्तकालय स्थिर है और आने वाले वर्षों के लिए इसके आसपास होने की संभावना है.
