ভ্যানিলা JavaScript দিয়ে ওয়েবসাইটের ব্যাকগ্রাউন্ড কালার পরিবর্তন করার পদ্ধতি শিখুন যখন আপনি আপনার মাউস সেটির ওপর নেবেন।
HTML
এখানে একটি সিম্পল HTML পেজের মার্কআপ:
<!DOCTYPE html> <html> <body> <h1>Move your move over this page</h1> </body> </html>JavaScript
মাউস পেজের যেকোনো অংশে নেলে ব্যাকগ্রাউন্ড কালার পরিবর্তন করতে, আপনাকে করতে হবে:
<body>এলিমেন্ট টার্গেট করুন এবং একটি রেফারেন্স একটি ভেরিয়েবলে স্টোর করুন।windowঅবজেক্টে একটি ইভেন্ট লিসেনার যাmouseoverইভেন্ট লিসেন করে।backgroundColorপ্রোপার্টি একটি কালার ভ্যালু দিয়ে অ্যাপ্লাই করুন।
আপনার JavaScript ফাইলে নিচের কোডটি যোগ করুন:
const bodyElement = document.querySelector("body") window.addEventListener("mouseover", function() { bodyElement.style.backgroundColor = "red" })এখন যতক্ষণ না ইউজার তাদের মাউস আপনার ওয়েবসাইটের যেকোনো অংশে নেবে, ব্যাকগ্রাউন্ড কালার ইনস্ট্যান্টলি লাল হয়ে যাবে।
কোড ডেমো চেক করুন।
কালার ভ্যালু হিসেবে আপনি রিয়েল নাম (যেমন "red"), hex বা rgba ভ্যালু ব্যবহার করতে পারেন।
