हम लेखों के एक और दौर के साथ जारी रखते हैं जिसमें हम डालते हैं उन तत्वों पर उच्चारण जो हमें मुफ्त में मिल सकते हैं codepen.io जैसी वेबसाइटों से। सीएसएस, HTML या जावास्क्रिप्ट में कोड लेने के लिए महान मूल्य की साइटें, और इस प्रकार एक वेबसाइट के दृश्य पहलू में उत्कृष्ट परिणाम; जिस वेबसाइट पर हम अच्छी तरह से क्रमादेशित कोड के कार्यान्वयन और रचनात्मक विचारों के साथ अन्य लक्ष्यों के लिए प्रेरित करेंगे।
इन कर रहे हैं 23 एनिमेटेड सीएसएस तीर यह उन तत्वों के लिए एकदम सही है जो उपयोगकर्ता के टकटकी को निर्देशित करते हैं जो एक विषयगत एक्स परियोजना की टीम से पहले गुजरने का इरादा रखते हैं, या उस स्थान पर जहां ई-कॉमर्स में खरीदारी की जा सकती है; तीर जो फ़नल बनाने में सक्षम होने के लिए आवश्यक हैं और इस प्रकार उस उत्पाद का अधिक रूपांतरण प्राप्त करते हैं जिसे हम अपने ईकामर्स में बेचते हैं।
एनिमेटेड सीएसएस तीर
तीर एक साइड स्क्रॉलिंग के साथ एनिमेटेड सीएसएस जो 23 की इस श्रृंखला में एनिमेटेड सीएसएस तीर का पहला नमूना हैं। महान दृश्य परिणामों के साथ तीर के लिए एक सरल प्रभाव और जो कहा गया था, उससे अधिक नहीं है।
एनिमेटेड तीर
एक एसवीजी में तीर जब हमारे पास उस पर माउस पॉइंटर होगा तो वह पर्याप्त और गुणवत्ता वाला एनीमेशन प्राप्त करेगा। एक परिपत्र गति में हम कई वेबसाइटों के लिए इस महत्वपूर्ण वेब तत्व को उजागर करेंगे।
ऐरो ऐनिमेशन
CSS और HTML में एक एनीमेशन जिसमें एक होता है एक तीर का सरल परिवर्तन अधिक क्लासिक के लिए और अधिक आधुनिक। एक अच्छा खत्म और काफी सरल के साथ एक तीर के लिए इस एनीमेशन से ज्यादा कुछ नहीं।
ऐरो एनिमेशन
में एनिमेटेड तीरों की एक श्रृंखला विभिन्न पदों और आंदोलनों। आंदोलन तीर के लिए पार्श्व है जिसमें एक "होवर" होता है जो उस स्थान को उजागर करता है जो तीर वेबसाइट पर ले जाता है।
तीर लिंक
ए मंडराना चक्र जब हम माउस पॉइंटर को इस आइकन के ऊपर छोड़ते हैं। एक काफी सरल, अच्छी तरह से तैयार किया गया एनीमेशन, लेकिन बाकी की तरह एक शानदार प्रभाव के साथ जिसे हम इस प्रविष्टि से साझा कर रहे हैं Creativos Online.
ट्रिपल तीर एनीमेशन
एसवीजी छवि के आधार पर, यहां आपके पास इस प्रकार के छवि प्रारूप के लिए समर्पित वेबसाइटों की एक श्रृंखला है, ए ट्रिपल एनीमेशन जो तीनों को ले जाता है शुरुआती तीर सिर्फ एक में। आपकी वेबसाइट के लिए एक और शानदार प्रभाव जो इसे एक पेशेवर स्पर्श देता है।
सरल सीएसएस तीर शीर्ष पर वापस
यह सीएसएस में सरल तीर वेबसाइट की शुरुआत में लौटने का कार्य है। शुरुआत और अंत गति के साथ एक बनावटी मोड़ जो पहली नज़र में एक साफ और सरल एनीमेशन बनाता है, हालांकि यह हमेशा पिछले एक की तरह एक पेशेवर स्पर्श देता है।
लोचदार तीर
यह लोचदार तीर इस तथ्य के लिए उल्लेखनीय है कि जब आप क्लिक करते हैं या आप इसे दबाते हैं, उस क्षेत्र में एक उछाल प्रभाव पैदा होगा जहां आइकन स्थित है। हमें यह पहचानना होगा कि यह मुख्य रूप से जावास्क्रिप्ट पर आधारित एक तीर है।
एनीमेशन के साथ SVG तीर
एक एसवीजी तीर जो आपका इंतजार कर रहा है पॉइंटर को नीचे छोड़ दें विस्थापन प्रभाव दिखाई देने के लिए और रंग लाल होने के लिए बदल जाता है, कम से कम उदाहरण में दिया गया है, तो यह हमारी पसंद और भविष्यवाणी के अनुरूप बनाने की बात होगी।
सीएसएस शेवरॉन तीर
रंग में परिवर्तन के साथ झुकने पर एक काफी सरल सीएसएस तीर। ए सबसे बुनियादी तीरों का, लेकिन क्योंकि गुणवत्ता की कोई कमी नहीं है और इतने सारे अन्य की तरह अपेक्षित स्पर्श।
एरो एसवीजी
एक संक्रमण प्रभाव आइकन के वजन या «वजन» मेंइस मामले में इस प्रविष्टि के नायक के रूप में एक तीर। आप बस एक सुंदर बुनियादी सीएसएस-आधारित प्रभाव के साथ तीर का वजन बढ़ाते हैं।
तीर लगाया हुआ
Un तीर प्रयोग जिसमें हम उन्हें div और pseudo तत्वों के साथ निर्मित होने की ख़ासियत के साथ एक अच्छी किस्म पाते हैं।
शुद्ध सीएसएस तीर
अन्य तीर के प्रकार जो समृद्ध करते हैं सूची, हालांकि यहां हम CSS और HTML में बनाए जाने से अलग खड़े हो सकते हैं।
घुमावदार सीएसएस तीर
अगर आप देना चाहते थे एक घुमावदार प्रभाव जैसे कि खींचा गया हो हाथ में, सीएसएस में यह तीर उस उद्देश्य के लिए आदर्श है।
तीर
सीएसएस संक्रमण के साथ एक तीर जो हासिल करते हैं एक तीर का क्षय प्रभाव कई चित्रों में जो प्रश्न में आंकड़ा खींचते हैं।
एक में तीन तीर
के लिए एक नाजुक एनीमेशन तीन तीरों को एक में बदलने का प्रबंधन करें। उन प्रभावों में से एक जो हम देख सकते हैं और हमारे पास इसका कोड है ताकि हम इसका उपयोग अपने काम या वेबसाइट में चाहते हैं।
शुद्ध सीएसएस स्क्रॉल एनीमेशन
में एक एनीमेशन अनंत मोड तीर की एक श्रृंखला जो दूसरे चरण को केंद्र के चरण में ले जाने देती है जब वे सबसे बड़े होते हैं। एक शानदार खत्म के साथ, यह एक वेब पर दिशा का पालन करने के लिए प्रोत्साहित करने के लिए एक आदर्श तीर बन जाता है।
SCSS तीर एनीमेशन
एक और बहुत सरल अनंत एनीमेशन और जो एक और तीर के लिए रास्ता बनाने के लिए लुप्त होती की विशेषता है और इस प्रकार एक बहुत ही विशेष "लूप" प्राप्त कर रहा है।
Gooey तीर एनीमेशन
इस तीर सूची में देखे गए सभी एनिमेशन में से, यह बिना किसी संदेह के है सबसे उत्सुक और सबसे रचनात्मक। एक एनीमेशन जो लगभग उस क्षेत्र से गुजरता है जिसमें यह लंबवत स्क्रॉल कर रहा है। अत्यधिक अपनी वेबसाइट पर आने वाले उपयोगकर्ता को आश्चर्यचकित करने के लिए अनुशंसित है।
अंत की ओर एनीमेशन
यह एनीमेशन, पिछले वाले की तरह है वेबसाइट के अंत में उपयोगकर्ता के लिए इतना है कि यह पाद करने के लिए गुजरता है। यह एक रचनात्मक एनीमेशन की विशेषता है जो इसे बाकी हिस्सों से बाहर खड़ा करता है। बेहतर है कि आप इसे लिंक से एक्शन से कोडपेन.आईओ में देखें।
सरल आइकन तीर
जैसा कि संकेत दिया गया एक आइकन बहुत सरल है और वह है यह एक साधारण एनीमेशन के होते हैं। इसका मतलब यह नहीं है कि हम जोशुआ मैकडॉनल्ड द्वारा साझा किए गए एक गुणवत्ता कोड का सामना कर रहे हैं।
शेख़ी तीर एनीमेशन
एक और तीर HTML और CSS में उछाल एनीमेशन जो दूसरों से अलग होने की कोशिश करता है। निश्चित रूप से आप इसे डेमो से प्राप्त करते हैं और लिंक डाउनलोड करते हैं।
ऐरो ऐनिमेशन
सीएसएस और HTML में एक तीर के लिए एक और एनीमेशन यह अच्छी तरह से «ले जाया गया» है। यह आपकी वेबसाइट के लिए 23 सीएसएस तीर की इस श्रृंखला के बाकी हिस्सों से इसे अलग करने में इसकी सबसे बड़ी संपत्ति है।
हैलो! जानकारी के लिए आपका बहुत बहुत धन्यवाद। मेरे पास घुमावदार तीर के बारे में एक सवाल है ... क्या वक्र के रोटेशन को बदलने का एक तरीका है? क्या आप मुझे एक कोड दिखा सकते हैं? मेरे द्वारा इसकी सराहना की जाएगी!