Bagaimana untuk menetapkan skrin penuh pelayar menggunakan jQuery

jQuery ialah perpustakaan JavaScript popular yang boleh digunakan untuk memudahkan pembangunan web. Dalam artikel ini, kita akan belajar cara menetapkan penyemak imbas ke skrin penuh menggunakan jQuery.

Dalam sesetengah kes, anda mungkin perlu menetapkan penyemak imbas kepada skrin penuh pada tapak web atau aplikasi web anda. Ini mungkin kerana anda perlu memaparkan kandungan anda pada skrin yang lebih besar atau anda perlu memberikan pengalaman yang lebih baik untuk pengguna anda. Walau apa pun alasannya, menetapkan pelayar anda kepada skrin penuh adalah mudah dengan jQuery.

Pertama, kita perlu menggunakan jQuery untuk memilih elemen yang kita mahu tetapkan skrin penuh. Kita boleh menggunakan kod berikut:

var elem = document.documentElement;

Kod di atas memilih keseluruhan halaman atau dokumen sebagai elemen untuk menjadi skrin penuh. Jika anda hanya mahu skrin penuh elemen tertentu, anda boleh menggunakan kod berikut:

var elem = document.getElementById("my-element");

Kod di atas memilih elemen dengan ID "elemen saya" sebagai elemen untuk menjadi skrin penuh.

Sekarang kami telah memilih elemen yang kami mahu gunakan skrin penuh, kami akan menggunakan kod berikut untuk mencapai skrin penuh:

if (elem.requestFullscreen) {
  elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen) {
  elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) {
  elem.msRequestFullscreen();
}

Kod di atas akan menyemak sama ada penyemak imbas menyokong skrin penuh dan pilih berdasarkan jenis pelayar Cara yang betul. Contohnya, Chrome menyokong kaedah webkitRequestFullscreen.

Sekarang kami telah menetapkan penyemak imbas kepada skrin penuh, kami perlu mengendalikan perkara yang berlaku apabila kami keluar dari skrin penuh. Kita boleh menggunakan kod berikut:

if (document.exitFullscreen) {
  document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
  document.webkitExitFullscreen();
} else if (document.msExitFullscreen) {
  document.msExitFullscreen();
}

Kod di atas akan menyemak sama ada penyemak imbas menyokong keluar dari skrin penuh dan memilih kaedah yang betul berdasarkan jenis penyemak imbas.

Selain kaedah skrin penuh dan kaedah keluar skrin penuh, kami juga boleh menggunakan kod berikut untuk menyemak sama ada ia berada dalam keadaan skrin penuh pada masa ini:

if (document.fullscreenElement || document.webkitFullscreenElement || document.msFullscreenElement) {
  // in fullscreen
} else {
  // not in fullscreen
}

Kod di atas akan menyemak sama ada penyemak imbas berada dalam keadaan skrin penuh, dan Keluarkan maklumat yang sepadan dalam konsol.

Ringkasan:

Menggunakan jQuery anda boleh menetapkan penyemak imbas ke skrin penuh dengan mudah. Kita boleh mencapai ini dengan memilih elemen, menetapkan skrin penuh dan keluar dari skrin penuh. Di samping itu, kami juga boleh menggunakan kod untuk menyemak sama ada ia dalam keadaan skrin penuh pada masa ini. Dalam aplikasi sebenar, memilih kaedah dan teknik yang berbeza mengikut keperluan boleh mencapai tetapan penyemak imbas skrin penuh dengan lebih baik.

Atas ialah kandungan terperinci Bagaimana untuk menetapkan skrin penuh pelayar menggunakan jQuery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!