Cara Membuat Tetingkap Skrin Penuh dengan Javascript (Regangan Seluruh Skrin)

Pengenalan

Mencapai penuh -pengalaman skrin untuk pelawat tapak web anda adalah penting untuk kandungan yang mengasyikkan. Pada masa lalu, ini mencabar kerana isu keserasian penyemak imbas. Walau bagaimanapun, dengan kemunculan penyemak imbas moden dan kemajuan dalam JavaScript, telah menjadi mungkin untuk menjadikan tetingkap menjadi skrin penuh dengan agak mudah.

Penyelesaian

Untuk membuat pelayar pelawat pergi ke skrin penuh menggunakan JavaScript, anda boleh memanfaatkan perkara berikut pendekatan:

function requestFullScreen(element) {
    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;

    if (requestMethod) { // Native full screen.
        requestMethod.call(element);
    } else if (typeof window.ActiveXObject !== "undefined") { // Older IE.
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

var elem = document.body; // Make the body go full screen.
requestFullScreen(elem);

Salin selepas log masuk

Penjelasan

Fungsi requestFullScreen() menyemak kaedah permintaan skrin penuh asli yang disokong oleh penyemak imbas berbeza.
Jika kaedah asli tersedia, ia memanggil kaedah itu pada elemen yang ditentukan (dalam kes ini, elemen badan untuk menjadikan seluruh halaman penuh skrin).
Untuk versi Internet Explorer yang lebih lama, ia menggunakan ActiveXObject untuk menghantar ketukan kekunci F11, yang mencetuskan mod skrin penuh.

Nota Tambahan

Mod skrin penuh memerlukan persetujuan pengguna, jadi adalah penting untuk mempunyai tindakan yang dimulakan pengguna (cth., klik butang) untuk mencetuskan permintaan.
Sesetengah penyemak imbas lama mungkin tidak menyokong sepenuhnya fungsi ini, jadi anda disyorkan untuk menyemak keserasian penyemak imbas sebelum melaksanakan penyelesaian ini.

Rujukan

[Menggunakan mod skrin penuh | MDN](https://developer.mozilla.org/en/DOM/Using_full-screen_mode)

Atas ialah kandungan terperinci Bagaimana Membuat Tetingkap Pelayar Skrin Penuh Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!