এলিমেন্টর অ্যানিমেটেড গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড (প্রো): মুভিং গ্রেডিয়েন্ট সেকশন
অ্যানিমেটেড গ্রেডিয়েন্ট বিজি হল একটি মাস্টার অ্যাডনস প্রো এক্সটেনশন যা একটি ধারক, বিভাগ বা কলামের পিছনে ধীরে ধীরে চলমান রৈখিক গ্রেডিয়েন্ট রাখে। আপনি দুই বা ততোধিক রঙ বাছাই করেন, কোণ, সময়কাল এবং সহজীকরণ, এবং গ্রেডিয়েন্ট কোনো ছবি বা ভিডিও ফাইল ছাড়াই লুপে সামনে পিছনে চলে যায়। এটি প্রায়শই হিরো বিভাগ, কল-টু-অ্যাকশন ব্যান্ড এবং শীঘ্রই আসছে পৃষ্ঠাগুলির জন্য ব্যবহৃত হয়। ব্যাকগ্রাউন্ডের পরিবর্তে গ্রেডিয়েন্ট-রঙের পাঠ্যের জন্য, বিনামূল্যে চেষ্টা করুন গ্রেডিয়েন্ট হেডলাইন উইজেট।
দুই বা ততোধিক রঙ, এক চলন্ত গ্রেডিয়েন্ট
মধ্যে রং যোগ করুন রঙ তালিকা, প্রতি রঙে একটি সারি। এক্সটেনশন অন্তত দুই প্রয়োজন। এটি একটি রৈখিক গ্রেডিয়েন্ট জুড়ে সমানভাবে স্পেস করে এবং শেষে প্রথম রঙের পুনরাবৃত্তি করে, তাই লুপের কোন শক্ত প্রান্ত নেই। কালার স্টপ পজিশন বা রেডিয়াল গ্রেডিয়েন্টের জন্য কোন সেটিংস নেই। আপনি রং বাছাই করার সাথে সাথে সম্পাদকের পূর্বরূপ আপডেট হয়।
- রঙের তালিকা: সারি যোগ করুন, নকল করুন বা মুছুন। দুই থেকে চারটি রঙ সাধারণত সবচেয়ে ভালো পড়ে।
- স্বচ্ছ রং: গ্রেডিয়েন্টটি বিভাগের স্বাভাবিক পটভূমির উপরে তার নিজস্ব স্তরে বসে, তাই স্বচ্ছতার সাথে রঙগুলি একটি পটভূমি চিত্রকে দেখাতে দেয়।
- যেখানে এটি কাজ করে: স্টাইল ট্যাবে কন্টেইনার, বিভাগ এবং কলাম। উইজেট প্যানেল পায় না।
কোণ, সময়কাল এবং সহজীকরণ
কোণ ডিফল্ট হিসাবে -45 সহ -45 থেকে 180 ডিগ্রি পর্যন্ত গ্রেডিয়েন্টের দিক নির্ধারণ করে। মোট অ্যানিমেশন সময়কাল (সেকেন্ড) 1 থেকে 20 পর্যন্ত চলে এবং ডিফল্ট 6 পর্যন্ত। গ্রেডিয়েন্টটি জুড়ে এবং পিছনে যেতে সময় লাগে। অ্যানিমেশন প্রভাব ইজিং সেট করে: লিনিয়ার, ইজ, ইজ ইন, ইজ আউট, ইজ ইন আউট, বা তিনটি মসৃণ বক্ররেখার মধ্যে একটি, ডিফল্ট হিসাবে মেটেরিয়াল ডিজাইন (মসৃণ) সহ।
- ধীর এবং সূক্ষ্ম: হিরো টেক্সটের পিছনে 12 থেকে 20 সেকেন্ড ভাল কাজ করে।
- সর্বদা চালু: লুপ শুরু হয় যখন পৃষ্ঠা লোড হয় এবং কোন হোভার বা স্ক্রোল ট্রিগার থাকে না।
- রূপান্তর মসৃণতা: এই স্লাইডারটি প্যানেলে দেখায়, তবে এটি বর্তমান সংস্করণে অ্যানিমেশন পরিবর্তন করে না।
এলিমেন্টর গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড বনাম অ্যানিমেটেড গ্রেডিয়েন্ট বিজি
Elementor এর বিনামূল্যের ব্যাকগ্রাউন্ড সেটিং এর একটি গ্রেডিয়েন্ট টাইপ আছে (Elementor 4.2।4 এ চেক করা হয়েছে), কিন্তু গ্রেডিয়েন্ট সরে না। আপনি নিজেই CSS কীফ্রেম লিখে এটিকে অ্যানিমেট করতে পারেন, বা এক্সটেনশন ব্যবহার করতে পারেন।
| বৈশিষ্ট্য | এলিমেন্টর গ্রেডিয়েন্ট | হাতে CSS | অ্যানিমেটেড গ্রেডিয়েন্ট বিজি |
|---|---|---|---|
| দাম | বিনামূল্যে | বিনামূল্যে | মাস্টার অ্যাডনস প্রো |
| আন্দোলন | স্ট্যাটিক | হ্যাঁ, আপনি কীফ্রেমগুলি লিখুন | হ্যাঁ, অন্তর্নির্মিত |
| রং | 2, স্টপ অবস্থান সহ | যেকোন | 2 বা তার বেশি, সমানভাবে ব্যবধানে |
| গ্রেডিয়েন্ট টাইপ | রৈখিক বা রেডিয়াল | যেকোন | শুধুমাত্র রৈখিক |
| কোণ | 0 থেকে 360, প্রতি ডিভাইসে | যেকোন | -45 থেকে 180 |
| গতি এবং সহজীকরণ | না | হ্যাঁ | সময়কাল 1 থেকে 20 সেকেন্ড, 8টি সহজ করার বিকল্প |
| সেট আপ | শৈলী প্যানেল | কাস্টম সিএসএস | শৈলী প্যানেল |
একটি স্থির গ্রেডিয়েন্টের জন্য, এলিমেন্টরের নিজস্ব সেটিং যথেষ্ট এবং স্টপ এবং গ্রেডিয়েন্ট টাইপের উপর আরও নিয়ন্ত্রণ দেয়। যখন আপনি গ্রেডিয়েন্ট সরাতে চান তখন এক্সটেনশন আপনাকে কীফ্রেম লিখতে বাঁচায়।
সম্পর্কিত: গ্রেডিয়েন্ট হেডলাইন গ্রেডিয়েন্ট টেক্সটের জন্য (ফ্রি), প্লাস কণা (বিনামূল্যে) এবং ব্যাকগ্রাউন্ড স্লাইডার (বিনামূল্যে) অন্যান্য চলমান ব্যাকগ্রাউন্ডের জন্য।
এলিমেন্টরে অ্যানিমেটেড গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড কিভাবে যোগ করবেন
একবার এক্সটেনশন চালু হলে, প্যানেলটি প্রতিটি ধারক, বিভাগ এবং কলামের স্টাইল ট্যাবে উপস্থিত হয়।
- মাস্টার অ্যাডনস প্রো সক্রিয় সহ, যান মাস্টার অ্যাডঅন > এক্সটেনশন এবং সুইচ অন অ্যানিমেটেড গ্রেডিয়েন্ট বিজি.
- Elementor দিয়ে আপনার পৃষ্ঠা সম্পাদনা করুন এবং একটি ধারক, বিভাগ বা কলাম নির্বাচন করুন।
- খোলা শৈলী ট্যাব এবং প্রসারিত করুন অ্যানিমেটেড গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড.
- সেট অ্যানিমেটেড গ্রেডিয়েন্ট সক্ষম করুন হ্যাঁ। তিনটি নমুনা রং প্রদর্শিত হবে।
- মধ্যে রং পরিবর্তন রঙ তালিকা, তারপর সেট কোণ, মোট অ্যানিমেশন সময়কাল (সেকেন্ড) এবং অ্যানিমেশন প্রভাব.
- পৃষ্ঠাটি আপডেট করুন এবং পরীক্ষা করুন যে আপনার পাঠ্য প্রতিটি রঙের বিপরীতে পাঠযোগ্য থাকে।
অ্যানিমেটেড গ্রেডিয়েন্ট বিজির জন্য প্রায়শই জিজ্ঞাসিত প্রশ্ন
অ্যানিমেটেড গ্রেডিয়েন্ট বিজি কি বিনামূল্যে?
না। এটি মাস্টার অ্যাডনস প্রো-এর অংশ। এলিমেন্টরের ফ্রি গ্রেডিয়েন্ট ব্যাকগ্রাউন্ড স্ট্যাটিক, তাই একটি চলমান গ্রেডিয়েন্টের জন্য এই এক্সটেনশন বা আপনার নিজস্ব CSS প্রয়োজন।
আমি কি এটি একটি ব্যাকগ্রাউন্ড ইমেজে ব্যবহার করতে পারি?
হ্যাঁ। গ্রেডিয়েন্টটি বিভাগের স্বাভাবিক পটভূমির উপরে তার নিজস্ব স্তরে আঁকা হয়। রঙ বাছাইকারীতে কিছুটা স্বচ্ছতার সাথে রঙ চয়ন করুন এবং পটভূমির চিত্রটি দেখায়।
আমি একটি অ্যানিমেশনে কতগুলি রঙ ব্যবহার করতে পারি?
অন্তত দুই, এবং আপনি যে পরে যোগ হিসাবে অনেক। রঙগুলি সমানভাবে ব্যবধান করা হয়, তাই সাধারণত দুই থেকে চারটি সবচেয়ে পরিষ্কার ফলাফল দেয়।
অ্যানিমেশন কি সব সময় বাজায়, নাকি আমি এটাকে হোভারে খেলতে পারি?
এটা সব সময় খেলে। লুপ শুরু হয় যখন পৃষ্ঠা লোড হয় এবং কোন হোভার বা স্ক্রোল ট্রিগার থাকে না। শুধুমাত্র হোভার ইফেক্টের জন্য আপনার নিজের CSS প্রয়োজন হবে, উদাহরণস্বরূপ কাস্টম সিএসএস এক্সটেনশন।
ট্রেন্ডিং এলিমেন্টর উইজেট এবং এক্সটেনশন
কম সময়ে অত্যাধুনিক ওয়েবসাইট তৈরি করুন।
গ্লাসমরফিজম
ধারক অতিরিক্ত
নিদর্শন
পোস্ট/পেজ ডুপ্লিকেটর
