JavaScript window.screenLeft

️ JavaScript window.screenLeft – একটি সম্পূর্ণ বাংলা টিউটোরিয়াল

window.screenLeft হলো JavaScript-এর একটি প্রপার্টি যা আপনাকে ব্রাউজারের উইন্ডোটি স্ক্রিনের বাম দিক থেকে কতটা দূরে আছে সেটি পিক্সেল (px) এ জানায়। এটি প্রধানত ডেস্কটপ ব্রাউজারে ব্যবহৃত হয় এবং UI কাস্টমাইজেশন, পপআপ উইন্ডো পজিশনিং ইত্যাদির জন্য গুরুত্বপূর্ণ।

এই প্রপার্টি সাধারণত উইন্ডো ম্যানিপুলেশন ও স্ক্রিন অ্যালাইনমেন্টে ব্যবহার করা হয়, যেমন আপনি যদি একটি নতুন উইন্ডো খুলতে চান এবং সেটিকে স্ক্রিনের ডান বা বাম দিকে ঠিকভাবে বসাতে চান।

window.screenLeft কিভাবে কাজ করে?

  • window.screenLeft ব্রাউজার উইন্ডোর বাম দিক থেকে স্ক্রিনের বাম প্রান্ত পর্যন্ত দূরত্ব (px)
  • এই ভ্যালু সাধারণত integer হয়
  • Left থেকে দূরত্ব বাড়ালে উইন্ডো স্ক্রিনের ডানদিকে সরবে

একটি বেসিক উদাহরণ:

আপনার ব্রাউজার উইন্ডো স্ক্রিনের বাম দিক থেকে কতদূরে আছে তা জানতে নিচের বাটনে ক্লিক করুন:

<script>
function getScreenLeft() {
// উইন্ডোর বাম পজিশন বের করছি
let left = window.screenLeft || window.screenX;

// output DOM-এ বসানো
document.getElementById(“screenLeftInfo”).innerHTML = “ ScreenLeft ভ্যালু: ” + left + “px”;
}
</script>

প্রতিটি লাইন ব্যাখ্যা (বাংলায়)

  • window.screenLeft – স্ক্রিনের বামদিক থেকে ব্রাউজার উইন্ডোর দূরত্ব খুঁজে বের করে
  • window.screenX – কিছু ব্রাউজারে screenLeft এর সমতুল্য (cross-browser সাপোর্ট)
  • document.getElementById() – HTML এর নির্দিষ্ট ID তে ফলাফল দেখাতে ব্যবহার করি

আরেকটি অ্যাডভান্স এক্সাম্পল: ডানদিক থেকে কত দূরে সেটিও হিসেব করা

নীচের কোডটি দিয়ে আপনি জানতে পারবেন স্ক্রিনের ডানদিক থেকে আপনার উইন্ডো কতদূরে আছে:

<script>
function getScreenRight() {
let left = window.screenLeft || window.screenX;
let width = window.outerWidth;
let screenWidth = screen.width;
let rightDistance = screenWidth – (left + width);

alert(” স্ক্রিনের ডান দিক থেকে উইন্ডোর দূরত্ব: ” + rightDistance + “px”);
}
</script>

সুবিধা সমূহ:

  • পপআপ উইন্ডো কোথায় শো হবে তা নির্ধারণ করতে পারবেন
  • মাল্টি-মনিটর সেটআপে পজিশনিং কাস্টমাইজ করতে পারবেন
  • ডায়নামিক ব্রাউজার UI তৈরিতে সহায়ক

⚠️ সাবধানতা:

  • সব ব্রাউজার একভাবে screenLeft সাপোর্ট করে না — তাই screenX fallback হিসেবে ব্যবহার করা হয়
  • মোবাইল ব্রাউজারে অনেক সময় এই প্রপার্টি কাজ নাও করতে পারে

Leave a Reply