Buka 2026 dengan Skill Baru
Diskon 25% untuk Semua Kelas di ITBOX
Periode 4-10 Desember 2025
Hari
Jam
Menit
Detik
SKILLBOX
Periode promo 17-24 Oktober 2025

Pop Up Adalah : Pengertian, Kegunaan, dan Cara Membuatnya

November 22, 2022

Pop Up Adalah : Pengertian, Kegunaan, dan Cara Membuatnya

Pop Up Adalah : Pengertian, Kegunaan, dan Cara Membuatnya – Dalam dunia teknologi, tentu kita tidak akan asing lagi dengan istilah Pop Up untuk mendeskripsikan pilihan menu yang muncul di layar website. Lantas, apakah Anda tahu seperti apakah popup itu sebenarnya?

Mengenal Apa Itu PopUp ? Pop Up Adalah

Mengenal Apa Itu PopUp

Ketika kita mengakses sejumlah hal pada web di komputer atau smartphone, kita terkadang akan menjumpai suatu jendela informasi kecil yang muncul saat memilih suatu opsi. Opsi ini melayang di halaman web tersebut. Jendela itulah yang kemudian disebut dengan popup.

Secara teknis, Pop Up adalah area tampilan antarmuka pengguna secara grafis (GUI) yang akan muncul secara tiba-tiba di latar depan visual yang sedang dihadapi oleh para pengguna web. Tampilan opsi ini akan muncul ketika kita memilih suatu tombol ataupun masuk ke halaman lain tertentu.

GUI sendiri dapat diartikan sebagai bentuk antarmuka yang memungkinkan para pengguna supaya dapat berinteraksi dengan perangkat elektronik tersebut melalui ikon-ikon grafis maupun indikator visual seperti notasi sekunder.

Lantas, Apa Jenis dan Kegunaannya Pop Up adalah?

Setelah mengetahui apa itu Popup. tentu kita penasaran apa yang menjadi kegunaan dari jendela notifikasi tersebut. Di bidang komputasi saja, jendela popup tersebut dapat digunakan untuk melakukan berbagai hal yang sangat bermanfaat, di antaranya:

PopUp Menu

Menampilkan berbagai menu dalam suatu halaman atau website menjadi salah satu kegunaan dari PopUp. Bahkan tanpa kita sadari, sudah sejak lama kita menggunakan opsi tersebut dalam kehidupan sehari-hari sewaktu menggunakan komputer.

Salah satunya seperti ketika melakukan klik kanan di halaman utama Windows. Jika kita klik mouse, maka akan didapati sejumlah opsi seperti Refresh, View, hingga Personalize yang muncul dalam sebuah jendela kecil.

Iklan

Pop Up juga dapat digunakan untuk membuat berbagai promosi. Tidak mengherankan jika kita akan menemui suatu popup iklan yang dapat muncul ketika mengakses suatu halaman web.

Sebagai contoh, ketika kita mengakses suatu halaman surat kabar online, maka tidak jarang kita akan menemui popup iklan yang malah menutup sebagian konten berita. Tentu saja Anda harus menutup popup tersebut untuk bisa mengakses isi beritanya secara utuh.

PopUp Graphics

Istilah PopUp juga biasanya dipakai pada video game dengan sebutan PopUp Graphics. Graphic Pop Up artinya juga didefinisikan sebagai suatu fenomena yang berkaitan dengan jarak penarikan terbatas dalam video game tiga dimensi.

Dari berbagai kegunaan di atas, tentu dapat dilihat jika PopUp sendiri memiliki berbagai fungsi yang mendasar. Setidaknya terdapat tiga fungsi tersebut, yakni:

Dialog Box

Berbeda dengan PopUp menu maupun iklan, ada juga dialog box yang berfungsi untuk memberi peringatan maupun konfirmasi kepada para pengguna. Pop Up Dialog box ini biasa muncul saat pengguna melakukan kesalahan saat mengakses suatu menu atau malah mendapatkan larangan.

Sebagai contohnya, ketika Anda menutup aplikasi atau suatu web, Anda tentu akan menemui jendela kecil yang muncul untuk mengonfirmasi apakah Anda akan menyimpan file terlebih dahulu, membatalkan aksi, atau bahkan melanjutkan keluar dari aplikasi tanpa harus menyimpannya.

Notifikasi

Fungsi popup yang banyak diketahui yakni sebagai notifikasi. Adapun notifikasi yang dimaksud ini bisa berupa peringatan bahkan benar-benar pemberitahuan mengenai informasi tertentu. Dengan adanya notifikasi ini, maka pengguna dapat membuat opsi tindakan apa yang akan dilakukan dengan cara mengklik jendela popup tersebut.

Sistem peringatan

Selain itu, ada juga Pop Up yang berperan sebagai sistem peringatan. Fungsi ini akan membantu para pengguna jika terjadi suatu kendala pada sistem perangkat. Peringatan ini sudah pasti akan memudahkan pengguna dalam menentukan tindakan apa yang harus dilakukan.

Sebagai contoh jika kondisi ruang penyimpanan pada perangkat hampir penuh. Dengan begitu, sistem akan memunculkan popup berupa notifikasi dan peringatan yang berkaitan dengan kondisi penyimpanan dari perangkat tersebut.

Alat promosi

Fungsi lain dari PopUp yakni sebagai alat atau sarana untuk promosi. Promosi dalam bentuk iklan dapat muncul jika Anda memasang aplikasi dengan fitur berbayar. Tidak jarang, fitur ini akan muncul pada laman aplikasi marketplace untuk memberitahu berbagai promo yang tersedia.

Membuat PopUp dengan Javascript

Membuat PopUp dengan Javascript

Setelah mengetahui apa itu Pop Up dan kegunaannya, ada baiknya jika Anda juga mengetahui cara membuat popup tersebut. Berbeda dengan PopUp di Pengaturan media sosial, jika Anda ingin membuat suatu web atau aplikasi sendiri, popup dapat ditampilkan dengan Javascript.

Terdapat 3 jenis Popup yang biasa dipakai pada Javascript, yakni Alert Box, Confirm Box, hingga Prompt Box. Alert Box biasanya digunakan untuk memberikan informasi singkat, Confirm Box untuk melakukan konfirmasi seperti pada registrasi data, dan Prompt Box untuk tindakan para pengunjung web tersebut melalui kolom Pop Up teks yang diberikan.

Sebelum mulai membuat popup, ada baiknya jika Anda menyiapkan text editor seperti Notepad untuk media pengetikan. Sebagai penampil hasilnya, Anda dapat menggunakan browser seperti Firefox atau Chrome yang mendukung ekstensi file HTML.

Untuk membuat popup dengan javascript, terlebih dahulu buatlah file teks bernama index.html. Pada file tersebut tambahkan kode berikut :

<html>
<head>
 <title>NAMA WEBSITE</title>
</head>
<body>
 <script>
 </script>
</body>
</html>

Selanjutnya di bagian <body> tambahkan kode

<button onclick="runPopup()">Click Me</button>

Alert Box

Untuk menampilkan Pop Up Javascript jenis Alert Box, setelah bagian <script> tambahkan perintah kode berikut :

function runPopup(){
window.alert("TULISKAN PESAN");
};

Sehingga menjadi:

<body>
 <button onclick="runPopup()">Click Me</button>
 <script> 
 function runPopup(){
 window.alert("TULISKAN PESAN");
 };
 </script>
</body>

Saat website dijalankan, maka popup akan muncul secara otomatis berisi tulisan yang sebelumnya Anda masukkan.

Confirm Box

Supaya bisa menampilkan popup jenis Confirm Box, maka pada bagian <script> Anda dapat menambahkan kode berikut.

function runPopup(){
 if(window.confirm("TULISKAN PESAN"))
 {
 window.alert("Sudah Tekan Ok!");
 }
 else
 {
 window.alert("Sudah Tekan Cancel!");
 }
 };
};

Sehingga akan menjadi

<body>
 <button onclick="runPopup()">Click Me</button>
 <script> 
 if(window.confirm("TULISKAN PESAN"))
 {
 window.alert("Sudah Tekan Ok!");
} 
else { 
window.alert("Sudah Tekan Cancel!"); } }; 
</script> 
</body>

Pada kode tersebut, nantinya popup akan secara otomatis meminta pengguna memberikan respons positif (OK) atau negatif (Cancel).

Prompt Box

Sama halnya dengan yang lain, pada bagian <script> Anda dapat menambahkan kode berikut.

function runPopup(){
 var respond = prompt("Masukkan Nama: ");
 if(respond != "")
 {
 window.alert("Halo, " + respond + "!");
 }
 else
 {
 window.alert("Pengguna Tidak Input Apapun");
 }
 };
};

Sehingga pada bagian <script> dan <body> akan menjadi seperti berikut.

<body>
 <button onclick="runPopup()">Click Me</button>
 <script> 
 function runPopup(){
 var respond = prompt("Masukkan Nama: ");
 if(respond != "")
{
 window.alert("Halo, " + respond + "!");
 }
 else
 {
 window.alert("Pengguna Tidak Input Apapun");
 }
 };
 </script>
</body>

Pada kode tersebut, Anda akan meminta respons pengunjung melalui kolom Pop Up yang sudah disediakan.

Share Artikel
Shopping cart0
There are no products in the cart!
Continue shopping
0

Level

Course Level

Category

Skill