גררו ווידג'ט HTML והדביקו בו את הקוד הזה:

<button class="d-button">אשר כניסה למסך מלא</button>
<script>
document.querySelector('.d-button').addEventListener('click', function() {
var elem = document.documentElement;
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
});
</script>

לחצו על הכפתור והקסם יחל 🤩

קצת הסבר:
מטעמי אבטחה של הדפדפים, ולשם הגנה על המשתמשים, בכל הדפדפנים – אין דרך לעשות מסך מלא אוטומטית או ללא התערבות יזומה ואישור מצד הגולש (משתמש הקצה), לכן אנחנו נותנים למשתמש ללחוץ על כפתור מסוים עם אישור הפעלת האפשרות 'מסך מלא', ורק אז נכנסים למסך מלא…

הקוד פועל על ידי זיהוי לחיצה על הכפתור שמכיל css-classes = d-button, וברגע הלחיצה עליו הוא מפעיל מצב מסך מלא!

שימו לב! הכפתור אמור לבוא תמיד לפני הJS לכן שימו אותו בדיוק לפי הסדר שהוזן כאן (למעלה בקטע הקוד)! וכן אם תרצו ליצור כפתור / ויידג'ט באלמנטור עם הקלאס d-button הוא אמור לבוא לפני תגית ה-script!!!