छवि स्क्रॉलिंग प्रभाव बनाने का एक तरीका चाहिए Elementor ? इस लेख में, हम आपको अपने वेब पेजों पर एलिमेंटर का उपयोग करके एक छवि स्क्रॉलिंग प्रभाव बनाने के लिए मार्गदर्शन करेंगे।
जब उपयोगकर्ता छवियों पर होवर करेगा तो छवि स्क्रॉल प्रभाव आपको पूरी छवि प्रकट करने की अनुमति देगा। जब आप किसी ऐसी वेबसाइट पर जाते हैं जो वेबसाइट टेम्प्लेट बेचती है, तो आप इमेज स्क्रॉल प्रभाव सुविधाओं के साथ टेम्प्लेट का पूरा पूर्वावलोकन देख सकते हैं।
इन फीचर्स की मदद से आप अपने यूजर्स को कम जगह में भी आसानी से वेबसाइट का पूरा व्यू दिखा सकते हैं। आम तौर पर, यदि आप किसी वेबसाइट की पूरी छवि प्रदर्शित करना चाहते हैं, तो यह आपके वेब पेजों पर बहुत अधिक जगह ले लेगी। इसके अलावा, यह आपकी वेबसाइट के डिज़ाइन को प्रभावित करता है।
लेकिन पिक्चर स्क्रॉल इफ़ेक्ट से आप आकर्षक तरीके से और भी तस्वीरें जोड़ सकते हैं जो दर्शकों का ध्यान आसानी से खींच सकती हैं।
एलीमेंटर में इमेज स्क्रॉल इफ़ेक्ट बनाएं
एलीमेंटर छवि स्क्रॉल प्रभाव जोड़ने के लिए विजेट प्रदान नहीं करता है। इसलिए आपको कस्टम सीएसएस का उपयोग करके प्रभाव जोड़ने की आवश्यकता है। कस्टम सीएसएस सुविधा केवल इसके साथ उपलब्ध है Elementor समर्थक। इसलिए सुनिश्चित करें कि आपने अपग्रेड कर लिया है Elementor प्रो।
अब, एलीमेंटर एडिटर के साथ एक पेज खोलें और एक सेक्शन जोड़ने के लिए प्लस आइकन पर क्लिक करें।
अब आपको अपने सेक्शन के लिए कॉलम का चयन करना होगा। यहां हम सिंगल कॉलम सेक्शन का चयन करते हैं।
अब सेक्शन एडिट आइकन पर क्लिक करें और लेआउट टैब में न्यूनतम ऊंचाई 500 पर सेट करें।
अब ब्लॉक विजेट से आंतरिक सेक्शन ब्लॉक को अपने बनाए गए सेक्शन में जोड़ें और डिफ़ॉल्ट कॉलम हटा दें। कॉलम संपादन आइकन पर राइट-क्लिक करें और मुख्य कॉलम को हटाने के लिए डिलीट विकल्प पर क्लिक करें।
फिर से आंतरिक अनुभाग के संपादन विकल्प पर जाएं और लेआउट टैब में न्यूनतम ऊंचाई 500 पर सेट करें जैसा कि हमने पहले दिखाया था।
अब इनर सेक्शन के स्टाइल टैब पर जाएं और बैकग्राउंड विकल्प से बैकग्राउंड को क्लासिक के रूप में सेट करें। इसके बाद, आपको अपनी पृष्ठभूमि छवि जोड़नी होगी। छवि स्थिति विकल्प से, छवि की स्थिति निर्धारित करें शीर्ष केंद्र. रिपीट विकल्प से विकल्प सेट करें कोई दोहराने और आकार जैसा आवरण.
अब टैब पर स्विच करें उन्नत कस्टम सीएसएस जोड़ने के लिए. कस्टम CSS फ़ील्ड में, निम्नलिखित कोड जोड़ें:
चयनकर्ता { -वेबकिट-संक्रमण: आसानी से अंदर-बाहर 3s !महत्वपूर्ण; संक्रमण: आसानी से अंदर-बाहर 3s !महत्वपूर्ण; } चयनकर्ता: होवर { पृष्ठभूमि-स्थिति: मध्य तल !महत्वपूर्ण; }
आप छवियों के स्क्रॉलिंग प्रभाव को बदलने के लिए संक्रमण मान को बदल सकते हैं। यदि आप एक ही प्रभाव से एकाधिक छवियां जोड़ना चाहते हैं, तो आप कॉलम की नकल कर सकते हैं और फिर पृष्ठभूमि छवि बदल सकते हैं।
निष्कर्ष
प्रक्रिया का पालन करके, आप पेज बिल्डर का उपयोग करके अपनी वेबसाइट पर एक छवि स्क्रॉल प्रभाव जोड़ पाएंगे Elementor. जानने के लिए आप हमारे अन्य लेख देख सकते हैं:
- गुटेनबर्ग संपादक में एलिमेंटर ब्लॉक का उपयोग कैसे करें?
- एलिमेंटर बनाम डिवि बनाम सीडप्रोड - कौन सा बेहतर है?
- एलीमेंटर में क्रियाओं को पूर्ववत और दोबारा करने के लिए इतिहास का उपयोग कैसे करें
- एलिमेंटर वेबसाइट को सुपर फास्ट कैसे बनाएं
- एलीमेंटर में इंटरएक्टिव सर्कल कैसे बनाएं
हमें उम्मीद है कि यह लेख आपके लिए उपयोगी होगा. अगर आपको यह आर्टिकल पसंद आया तो जुड़े रहने के लिए कृपया हमारे फेसबुक पेज को लाइक करें।
