लंबन है लंबन प्रभाव: उदाहरण

विषयसूची:

लंबन है लंबन प्रभाव: उदाहरण
लंबन है लंबन प्रभाव: उदाहरण
Anonim

गति में, लंबन का अर्थ है किसी प्रेक्षक के सापेक्ष किसी वस्तु की स्थिति में परिवर्तन। इस शब्द ने इंटरनेट पर लोकप्रियता हासिल की है। विशेष रूप से, साइट दिलचस्प लगती है, जिसके डिजाइन में गतिशील तत्व होते हैं। Parallax एक वेब पेज डिज़ाइन तकनीक है जिसका उपयोग वेबमास्टर्स द्वारा बड़ी संख्या में आगंतुकों को आकर्षित करने के लिए किया जाता है।

लंबन कैसा होता है

लंबन स्क्रॉलिंग का उपयोग लंबवत के साथ-साथ एक सीधी रेखा में भी किया जा सकता है। निन्टेंडो सबसे अच्छा उदाहरण है। हम में से कई लोग पुरानी यादों के साथ याद करते हैं, जो स्क्रीन के बाईं ओर से दाईं ओर मुख्य पात्रों के आंदोलन द्वारा दर्शाए जाते हैं। लंबवत स्थित सीधी रेखा के साथ नीचे ले जाना भी संभव है। वेब पर लंबन प्रभाव का अक्सर उपयोग किया जाता है। आप एक लंबवत स्लाइडर बनाने के लिए जावास्क्रिप्ट या सीएसएस का उपयोग कर सकते हैं 3.

वर्णित त्रि-आयामी स्थानिक प्रभाव उनकी विशेषता मात्र है। खेलों के रचनाकारों ने कई पृष्ठभूमि परतों का उपयोग किया। वे बनावट में भिन्न होते हैं, जबकि आंदोलन अलग-अलग होते हैंगति।

ऐसा मत सोचो कि लंबन सिर्फ एक 3D प्रभाव है। पृष्ठ पर, आप मौजूदा चिह्नों को स्थानांतरित कर सकते हैं। इसके अलावा, यह काफी आकर्षक दिखता है। एक विशेष रूप से अच्छा विकल्प उनमें से प्रत्येक के लिए एक व्यक्तिगत प्रक्षेपवक्र का उपयोग करना है। इस मामले में, विभिन्न प्रक्षेपवक्रों के साथ चलते हुए, विभिन्न चिह्नों का उपयोग किया जाता है। यह डिज़ाइन ध्यान आकर्षित करता है।

लंबन is
लंबन is

तस्वीर में जान आ जाती है

बिना इमेज वाली साइट ढूंढना मुश्किल है। उच्च-गुणवत्ता और प्रदर्शनकारी चित्र आगंतुकों को आकर्षित करते हैं। लेकिन सबसे अधिक ध्यान विभिन्न प्रकार की गतिशील छवियों की ओर खींचा जाता है। दरअसल, अगर किसी साइट पर जाते समय कोई हलचल होती है, तो यह ध्यान आकर्षित करता है। किसी विज़िटर के किसी संसाधन पर गतिशील छवि पर लौटने की संभावना को महत्वपूर्ण रूप से बढ़ाता है। हिलता दिख रहा था या नहीं? इसलिए, साइट पर आगंतुकों को आकर्षित करने के लिए, लंबन प्रभाव जैसी चीज का अध्ययन करना उचित है।

मूविंग इमेज साइट उदाहरण:

  • hvorostovsky.com;
  • www.kagisointeractive.com.

जैसा कि उदाहरणों में दिखाया गया है, ड्रॉप-डाउन मेनू द्वारा उप-आइटम में अनुभव को बेहतर बनाया गया है। ऐसा तत्व आगंतुकों के लिए समय बचाता है, इसलिए यह उनके लिए आकर्षक है।

jQuery पुस्तकालय

शब्द jQueryParallax एक ही नाम के पुस्तकालय को परिभाषित करता है। इसके लिए धन्यवाद, 3 डी प्रारूप में आंदोलन के प्रभाव को प्राप्त करना आसान है। JQuery लाइब्रेरी में, 3D धारणा कई तरह से बनाई जाती है। उनमें से एक के साथ पृष्ठभूमि वस्तुओं के क्षैतिज एक साथ आंदोलन में शामिल हैंअलग गति। यह पुस्तकालय बड़ी संख्या में विभिन्न प्रकार की संपत्तियों की उपस्थिति की विशेषता है। और यहाँ वर्णित विस्थापन इसकी क्षमताओं का केवल एक छोटा सा हिस्सा है।

साइट काफी आकर्षक लगती है, जिसके निर्माण के लिए विभिन्न आधुनिक तत्वों का उपयोग किया गया था। उनमें से एक लंबन है। उदाहरण साइटें इस तरह दिख सकती हैं:

  • www.grabandgo.pt;
  • www.fishy.com.br;
  • www.noleath.com;
  • buysellwebsite.com.

jParallax को उन परतों द्वारा दर्शाया जाता है जो माउस के साथ चलती हैं। गतिशील तत्वों को पूर्ण स्थिति (स्थिति: पूर्ण;) द्वारा विशेषता है। उनमें से प्रत्येक को अपने स्वयं के आकार और एक व्यक्तिगत गति से गति की विशेषता है। यह पाठ या छवि हो सकती है (संसाधन के रचनाकारों के अनुरोध पर)।

लंबन स्क्रॉलिंग
लंबन स्क्रॉलिंग

साइट विज़िटर की धारणा

उसके बाद, एक व्यक्ति आमतौर पर इस तथ्य पर ध्यान देता है कि पृष्ठ उच्च गुणवत्ता, सुविधाजनक और ज्ञानवर्धक के साथ बनाया गया है। इस तथ्य का आमतौर पर सम्मान किया जाता है। ऐसा होता है कि अन्य तत्वों को आजमाने के लिए जिज्ञासा पैदा होती है। इंटरनेट पर बड़ी संख्या में समान साइटें हैं। अपने संसाधन को विशेष कैसे बनाएं?

यदि आपको डिज़ाइन पसंद है, तो आगंतुक अधिक समय तक रुकेंगे। इस प्रकार, पोस्ट की गई जानकारी से उसके आकर्षित होने की संभावना बढ़ जाती है, वह रुचि दिखाएगा। परिणामस्वरूप, एक व्यक्ति प्रस्तावित सेवा, उत्पाद या प्रचार प्रस्ताव का उपयोग करेगा।

पसंदीदा पुराने खेल

"लंबन" की अवधारणा सभी को परिचित होनी चाहिए80 और 90 के दशक के प्रशंसकों को सांत्वना दें। यह खेलों पर लागू होता है:

  1. मारियो ब्रदर्स
  2. मौत का संग्राम।
  3. क्रोध की सड़कें।
  4. चंद्रमा गश्त।
  5. समय में कछुए।

अर्थात लंबन एक ऐसी तकनीक है जिसका उपयोग काफी लंबे समय से किया जा रहा है। इन खेलों को वास्तव में कुछ पुरानी यादों के साथ याद किया जाता है। आखिर वे उस दौर के चरित्र से ओत-प्रोत लगते हैं।

स्क्रीन पर इमेज लंबन स्क्रॉलिंग जैसी तकनीक का उपयोग करके बनाई जाती हैं। इसमें कोई आश्चर्य की बात नहीं है कि इस तकनीक ने अच्छी-खासी लोकप्रियता हासिल की है। यह डिजाइन अवधारणा उन लोगों द्वारा गर्मजोशी से प्राप्त की जाती है जिन्होंने 80-90 के दशक में खेला या दोस्तों के ख़ाली समय को देखा।

लंबन कैसे करें
लंबन कैसे करें

लंबन स्क्रॉलिंग

दुनिया के प्रमुख ब्रांडों के विपणक लंबे समय से सभी प्रकार की तकनीकी प्रगति का उपयोग करते रहे हैं। इस प्रकार, साइट पर एक आकस्मिक आगंतुक को भी दिलचस्पी लेना संभव हो जाता है।

नाइके द्वारा लंबन स्क्रॉलिंग का काफी सफलतापूर्वक उपयोग किया गया है। कंपनी की मूल वेबसाइट वीडेन और केनेडी द्वारा डिजाइन की गई थी। लेकिन यह डिजाइन टिक नहीं पाया। हमारे समय के रुझानों के अनुसार संसाधन को धीरे-धीरे अपडेट किया गया। Activatedrinks.com एक ऐसी साइट का उदाहरण है जिसका डिज़ाइन उस समय की नाइके मार्केटर्स द्वारा उपयोग की जाने वाली साइट की याद दिलाता है।

लंबन उदाहरण
लंबन उदाहरण

स्पीकर ज्यादा नहीं होने चाहिए

यह मत भूलो कि साइट का डिज़ाइन अक्सर प्रमुख मानदंड होता है जो आगंतुक का मार्गदर्शन करता है। खराब तरीके से अंजाम दिया गयासंसाधन आमतौर पर उपयोगकर्ता को मालिक कंपनी की तुच्छता की छाप छोड़ देता है। लेकिन सभी प्रकार के आकर्षक डिजाइन तत्वों वाली साइट संगठन के मालिकों की रुचि आगंतुकों की इच्छा को इंगित करती है।

यहाँ यह लंबन के बारे में याद रखने योग्य है। यह एक अद्भुत उपकरण है। लेकिन यहां तक कि उन्हें भी बहकावे में नहीं आना चाहिए। क्योंकि जिस पृष्ठ पर विभिन्न प्रकार के गतिमान तत्वों की एक बड़ी संख्या होती है, उसे समझना काफी कठिन होता है। डिज़ाइन को मध्यम रूप से स्टाइलिश और समझने योग्य बनाना सबसे अच्छा है।

गतिशील व्यक्तिगत तत्व होने चाहिए जिन्हें चयन की आवश्यकता होती है। एक चित्र भी हो सकता है जो एक सापेक्ष को दूसरे के सापेक्ष ले जाने वाली परतों का उपयोग करके बनाया गया हो। यह मत भूलो कि उपयोगकर्ता साइट मुख्य रूप से आगंतुकों के लिए डिज़ाइन की गई है। यह एक वेबमास्टर की उत्कृष्ट कृति होने की आवश्यकता नहीं है जिसने अपना सारा ज्ञान इसमें डाल दिया है। आखिरकार, ऐसा दृष्टिकोण केवल धारणा को जटिल करेगा।

वेबसाइट के लिए लंबन प्रभाव
वेबसाइट के लिए लंबन प्रभाव

साइट नेविगेशन कैसे बनाएं

लंबन कैसे बनाते हैं? यह सवाल कई वेबसाइट बनाने वालों के लिए दिलचस्पी का है। टैग लिखने की पेचीदगियों को जानना आवश्यक नहीं है। इंटरनेट पर विशेष संसाधनों का उपयोग करना बहुत सुविधाजनक है। बड़ी संख्या में उपलब्ध प्रस्तावों से, निम्नलिखित सहायकों को प्रतिष्ठित किया जा सकता है:

  1. Plax एक ऐसा प्रोग्राम है जिसका उपयोग करना काफी आसान है। यह माउस को घुमाकर पृष्ठ को तरल बनाता है।
  2. jQuery लंबन छवि स्लाइडर - छवि स्लाइडर बनाने के लिए उपयोग किया जाने वाला एक jQuery प्लगइन।
  3. Jquery Image Parallax - पारदर्शी चित्र डिजाइन करने के लिए उपयुक्त। उसके द्वारा PNGs के उपयोग के माध्यम से, GIFs गति से अनुप्राणित, गहराई तक ले जाते हैं।
  4. Curtain.js का उपयोग फिक्स्ड पैनल वाले पेज को बनाने के लिए किया जाता है। ऐसे में पर्दों के खुलने का असर देखने को मिलता है।
  5. स्क्रॉलिंग लंबन: एक jQuery प्लगइन माउस व्हील को स्क्रॉल करते समय एक लंबन प्रभाव बनाने के लिए है।
कर्सर के लिए लंबन लंगर
कर्सर के लिए लंबन लंगर

कुछ और उपयोगी प्लगइन्स

जैसा कि आप जानते हैं, जानकारी का सबसे बड़ा मूल्य है। और वांछित प्राप्त करने के तरीकों की संख्या जितनी अधिक होगी, सही परिणाम प्राप्त करने की संभावना उतनी ही करीब होगी। डायनामिक्स बनाने के लिए उपयोग किए जाने वाले उपयोगी प्लगइन्स:

  1. jQuery स्क्रॉल पथ - निर्दिष्ट पथ पर वस्तुओं को रखने के लिए उपयोग किया जाता है।
  2. Scrollorama एक jQuery प्लगइन है। इसका उपयोग आकर्षक सामग्री डिजाइन के लिए एक उपकरण के रूप में किया जाता है। सुविधाजनक स्क्रॉलिंग के कारण आपको पृष्ठ पर टेक्स्ट को "पुनर्जीवित" करने की अनुमति देता है।
  3. स्क्रॉलडेक एक jQuery प्लगइन है। यह एकल पृष्ठ साइटों के लिए एक बेहतरीन प्रस्तुति समाधान है।
  4. jParallax माउस पॉइंटर की गति के आधार पर परतों की गति को दर्शाता है।
  5. Stellar.js एक प्लगइन है जिसके साथ किसी भी तत्व को एक लंबन स्क्रॉलिंग प्रभाव के साथ डिज़ाइन किया गया है।
लंबन प्रभाव उदाहरण
लंबन प्रभाव उदाहरण

कर्सर से जुड़ा लंबन

यह लंबन काफी प्रभावशाली लगता है। पहली नज़र में गतिहीनजब माउस कर्सर आता है तो साइट पेज ऑब्जेक्ट हिल जाते हैं। ऐसा लगता है कि यह जीवन में आ गया है और स्थानांतरित होने वाले तत्व का अनुसरण करता है।

सबसे पहले, आपको तस्वीर पर रुकना चाहिए। आवश्यक छवि को एक फ्रेम में रखा गया है, जबकि इसके किनारों को छिपाया जाना चाहिए। विधि बहुत सरल है, और परिणामी चित्र काफी आकर्षक लगता है।

साइट के लिए लंबन प्रभाव डिजाइन करने का एक शानदार तरीका है। इसका उपयोग इंगित करता है कि संसाधन के निर्माण पर उचित ध्यान दिया गया था। इसलिए, दी जाने वाली सेवाओं या पढ़ने के लिए जानकारी पर ध्यान देने योग्य है। ऐसी साइटें समान, लेकिन सरल रूप से डिज़ाइन किए गए संसाधनों की पृष्ठभूमि में अधिक लाभप्रद दिखती हैं।

सिफारिश की: