این آموزش در تاریخ ۱۴۰۱/۰۵/۱۴ آپدیت شده است.
آموزش متد requestFullscreen در DOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش متد requestFullscreen در DOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
متد requestFullscreen در DOM جاوااسکریپت
با استفاده از متد ()requestFullscreen میتونیم یک عنصر / تگ رو در حالت تمام صفحه ( Full Screen ) باز کنیم.
برخی از مرورگرهای اینترنتی بصورت عادی نمیتونن از این متد پشتیبانی کنند، به همین دلیل ما باید از یکسری پیشوندها برای هر یک از این مرورگرها استفاده نماییم.
- webkit : برای مرورگرهای Chrome ، Safari و Opera
- ms : برای مرورگر اینترنت اکسپلورر نسخه ۱۱
- moz : برای مرورگر موزیلا فایرفاکس یا Firefox
| مقدار برگشتی | هیچی |
|---|
Free-Learn
مثال از این متد
در ادامه میتوانید یک مثال از این متد را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : با کلیک بروی یک دکمه، باکس محتوا بصورت تمام صفحه باز خواهد شد و با کلیک بروی دکمه دیگر، از حالت تمام صفحه خارج خواهد شد.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<script> function ShowFullScreen(){ var MyBox; MyBox = document.getElementById("MyBox"); if ( MyBox.requestFullscreen ) { MyBox.requestFullscreen(); }else if( MyBox.webkitRequestFullscreen ) { // Safari , Chrome , Opera MyBox.webkitRequestFullscreen(); }else if( MyBox.mozRequestFullscreen ) { // FireFox MyBox.mozRequestFullscreen(); }else if( MyBox.msRequestFullscreen ) { // Internet Explorer 11 MyBox.msRequestFullscreen(); } } function HideFullScreen(){ if ( document.exitFullscreen ) { document.exitFullscreen(); }else if( document.webkitExitFullscreen ) { // Safari , Chrome , Opera document.webkitExitFullscreen(); }else if( document.mozExitFullscreen ) { // FireFox document.mozExitFullscreen(); }else if( document.msExitFullscreen ) { // Internet Explorer 11 document.msExitFullscreen(); } } </script> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این متد در جاوااسکریپت پشتیبانی میکنند یا خیر.
| نام متد | Chrome | Firefox | Opera | Safari | Edge |
| ()requestFullscreen | ۷۱ (webkit) 15 |
۶۴ (moz) 9 |
۵۸ (webkit) 15 |
(webkit) 6 | ۷۹ |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این متد در جاوااسکریپت بصورت زیر می باشد.
- استفاده در حالت عادی :
|
1 |
Element.requestFullscreen(); |
- استفاده از پیشوندها برای پشتیبانی دیگر مرورگرها :
|
1 2 3 |
Element.webkitRequestFullscreen(); // Chrome , Safari , Opera Element.msRequestFullscreen(); // Internet Explorer (IE) Element.mozRequestFullscreen(); // FireFox |
Free-Learn
نکات و توضیحات
- این متد هیچ پارامتری نمیگیرد
- با استفاده از متد ()exitFullscreen میتونیم یک تگ رو از حالت تمام صفحه خارج کنیم
