این آموزش در تاریخ ۱۴۰۱/۱۰/۳۰ آپدیت شده است.
آموزش ویژگی width در BOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی width در BOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ویژگی width در BOM جاوااسکریپت
با استفاده از ویژگی screen.width میتونیم اندازه کل عرض ( width ) صفحه نمایش رو بدست آوریم، که این اندازه شامل همه چیز میشه ( از جمله نوار وظیفه یا Windows Taskbar )
و همچنین با استفاده از ویژگی screen.height میتونیم اندازه کل ارتفاع ( height ) صفحه نمایش رو بدست آوریم، که این اندازه شامل همه چیز میشه ( از جمله نوار وظیفه یا Windows Taskbar )
| مقدار برگشتی | برگشت یک عدد که نشان دهنده اندازه کل عرض صفحه نمایش می باشد * مقدار برگشتی برحسب پیکسل ( PX ) می باشد |
|---|
Free-Learn
مثال از این ویژگی
در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : بدست آوردن اندازه کل عرض و ارتفاع صفحه نمایش
|
1 2 3 4 5 6 7 8 9 10 |
<script> function Get(){ var My_Width,My_Height; My_Width = "Width : " + screen.width + "<br>"; My_Height = "Height : " + screen.height + "<br>"; document.getElementById("Result").innerHTML = My_Width + My_Height; } </script> |
مثال شماره ۲ : اگه اندازه عرض کل صفحه نمایش کمتر از ۷۰۰ پیکسل بود، یک پیغام میده ، و اگه بیشتر بود یک پیغام دیگه
- در این مثال از دستور شرطی if استفاده شده. ( آموزش دستور شرطی IF )
|
1 2 3 4 5 6 7 8 9 10 11 |
<script> My_Width = screen.width; if( My_Width <= 700 ){ alert("اندازه کمتر از ۷۰۰ هست"); }else{ alert("اندازه بیشتر از ۷۰۰ هست"); } </script> |
مثال شماره ۳ : اگه اندازه عرض کل صفحه نمایش کمتر از ۷۰۰ پیکسل بود و ارتفاعش هم کمتر از ۶۰۰ بود یک پیغام میده
- در این مثال از دستور شرطی if و عملگر منطقی && استفاده شده. ( آموزش دستور شرطی IF و آموزش عملگرهای منطقی )
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> My_Width = screen.width; My_Height = screen.height; if( My_Width <= 700 && My_Height <= 600 ){ alert("عرض کمتر از 700 و ارتفاع کمتر از 600"); }else{ alert("عرض بیشتر از 700 و ارتفاع بیشتر از 600"); } </script> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این ویژگی در جاوااسکریپت پشتیبانی میکنند یا خیر.
| نام ویژگی | Chrome | Firefox | Opera | Safari | Edge |
| width | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.
|
1 |
screen.width; |
Free-Learn
نکات و توضیحات
- این ویژگی یک ویژگی فقط خواندنی یا Read-Only می باشد.
- ویژگی width اندازه کل عرض صفحه نمایش رو برمیگردونه. ( شامل نوار وظیفه ویندوز میشه )
- ویژگی height اندازه کل ارتفاع صفحه نمایش رو برمیگردونه. ( شامل نوار وظیفه ویندوز میشه )
- ویژگی availWidth میزان اندازه عرض در دسترس صفحه نمایش رو برمیگردونه. ( شامل نوار وظیفه ویندوز نمیشه )
- ویژگی availHeight میزان اندازه ارتفاع در دسترس صفحه نمایش رو برمیگردونه. ( شامل نوار وظیفه ویندوز نمیشه )
