membuat fullscreen dengan onclick javascript

membuat fullscreen dengan onclick javascript

13.34
Hallo blogger kali ini saya akan menjelaskan tentang membuat browser fullscreen dengan menggunakan event onclick javascript. fullscreen biasanya digunakan untuk menampilkan vidio / gambar hingga tampilan web. seperti yang kita lihat di youtube terdapat tombol fullscreen di bagian bawah kanan player vidio, ketika kita klik maka secara otomatis vidio akan memenuhi layar kita atau sering juga kita sebut (Full Screen). secara manual fullscreen dapat kita lakukan dengan cara menekan tombol  F11 pada key board.

mungkin saya kira cukup untuk penjelasan apa itu fullscreen lansung saja masuk ke materi. untuk melakukan fullscreen dapat kita lakukan dengan berbagai macam cara yaitu :

  1. javascript
  2. jquery
  3. tombol f11 di keybord
Namun kali ini saya hanya akan menjelaskan dengan metode javascript caranya adalah :

  1. buat sebuah halaman html dengan nama arifweb.html
  2. masukkan script berikut
    <html>
    <head>
    <title> Arifweb.com membuat fullscreen dengan javascript</title>
        <script type="text/javascript">
            function toggleFullScreen() {
      if ((document.fullScreenElement && document.fullScreenElement !== null) ||  
       (!document.mozFullScreen && !document.webkitIsFullScreen)) {
        if (document.documentElement.requestFullScreen) {
          document.documentElement.requestFullScreen();
        } else if (document.documentElement.mozRequestFullScreen) {
          document.documentElement.mozRequestFullScreen();
        } else if (document.documentElement.webkitRequestFullScreen) {
          document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        }
      } else {
        if (document.cancelFullScreen) {
          document.cancelFullScreen();
        } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
          document.webkitCancelFullScreen();
        }
      }
    }
        </script>
    </head>
    <body>
        Klik tombol dibawah ini untuk fullscreen </br>
        <button onclick="toggleFullScreen ();">Klik disini</button>
       
    </body>
    </html>
    3. // pada button sudah kita selipkan event onclick yang akan memanggil fungsi toggleFullScreen
  3. buka arifweb.html di browser
  4. klik tombol "klik disini"
  5. lihat apa yang terjadi
mungkin cukup sekian tutorial saya kali ini tentang membuat fullscreen dengan onclick javascript. jika artikel ini bermanfaat dan ada yang ingin ditanyakan silahkan masukkan ke kolom komentar terima kasih :)
Muhammad Arif

Share this

Related Posts

Next
« Prev Post
Previous
Next Post »

1 komentar:

komentar
Anonim
1 Desember 2022 pukul 12.53 delete

You may also cease our collection of location info by following 카지노 사이트 the usual uninstall process to take away all of our mobile purposes out of your system. You are required to create an account on the Services in order to to} benefit of|benefit from|reap the benefits of} certain options of the Services. When these checks are unable to verify that you're twenty one years of age or over, or are unable to verify any other detail offered by you, we reserve the right to ask for extra proof.

Reply
avatar

Langganan: Posting Komentar (Atom)