FULLSCREEN API

Fullscreen API adalah antarmuka yang memungkinkan kamu untuk melihat elemen web dalam mode fullscreen, yang berarti elemen tersebut akan memenuhi seluruh layar perangkat pengguna. API ini sangat berguna untuk berbagai situasi seperti waktu main game online, menonton video, atau membuat presentasi slide yang memenangkan layar secara penuh.

Metode Fullscreen API

Ada beberapa metode dalam Fullscreen API yang penting untuk dipelajari:

1. requestFullscreen()

Metode ini digunakan untuk membuka elemen dalam mode fullscreen. Kamu bisa menggunakan metode ini pada elemen apa pun dalam DOM.

Contohnya seperti ini:

element.requestFullscreen();

2. exitFullscreen()

Metode ini digunakan untuk keluar dari mode fullscreen. Kamu bisa menggunakan metode ini untuk kembali ke tampilan normal.

Contohnya seperti ini:

document.exitFullscreen();

Event Fullscreen API

Ada beberapa event yang berkaitan dengan Fullscreen API yang perlu kamu ketahui:

1. fullscreenchange

Event ini akan dijalankan setiap kali status fullscreen berubah, baik saat masuk atau keluar dari mode fullscreen.

element.addEventListener("fullscreenchange", function() {
  if (document.fullscreenElement) {
    console.log("Welcome to fullscreen mode.");
  } else {
    console.log("You've just exited fullscreen mode.");
  }
});

2. fullscreenerror

Event ini akan dijalankan jika terjadi kesalahan saat mencoba untuk beralih ke mode fullscreen atau keluar dari mode tersebut.

element.addEventListener("fullscreenerror", function() {
  console.log("An error occurred while trying to switch to fullscreen mode or exit from it.");
});

Dengan memahami dan menerapkan metode dan event tersebut, kamu bisa membuat pengalaman pengguna yang lebih baik lagi dengan memberikan opsi untuk beralih ke mode fullscreen. Selamat mencoba!