contact
WA: 0822-8846-7823
SMS: 0822-8846-7823
Call: 0822-8846-7823
BBM: D7DB3491
ebsofmail@gmail.com

Membuat Pop Up Window dengan Javascript

Posted in Javascript Jquery Life at 08 Juni 2017 With 0 Comments

admin siang hari ini akan share Cara membuat POP UP window dengan javascript, Lanjut dari postingan kemarin yaa Mengambil Nilai dari Checkbox dengan Javascript.. disini masih seputar Javascript yaitu membuat pop-up window. Secara sederhana pop-up window dapat diartikan window tambahan yang muncul mengiringi window utama. Misalnya kita mengunjungi suatu website tetapi juga muncul window lainnya setelah website utama muncul. Nah metode ini banyak yang dimanfaatkan para pengiklan untuk memunculkan iklan mereka. Pada pembahasan kita kali ini kita akan coba membuat pop-up window.

Demo Pop Up window Dengan Javascript

cara membuat pop up window dengan javascript

Cara Membuat Pop Up Window dengan Javascript

▼ Download Source Code Dibawah Ini ▼


langsung saja kita ke coding ya ,

popup1.html

<html>
<head>
<title>Membuat Pop-Up Window</title>
<script language="javascript">
function buka_popup(){
 window.open('popup2.php', '', 'width=640, height=480, menubar=yes,location=yes,scrollbars=yes, resizeable=yes, status=yes, copyhistory=no,toolbar=no');
}
</script>
<body onLoad="buka_popup();">
<p>Anda juga dapat membuka window popupnya dari sini</p>
<a href="javascript: buka_popup();">KLIK DISINI</a>
</body>
</html>

popup2.php

<html>
<head>
<title>Ini Window Ke 2</title>
</head>
<body>
<p>Jika anda dapat melihat saya maka anda berhasil</p>
<a href="javascript: window.close()">Tutup Window[X]</a>
</body>
</html>

Jalankan popup1.html dengan menggunakan browser, nah.. bagaimana... ???

Cara ke-2 Membuat Pop Up dengan Javascript

 
Note: Untuk menggunakan cara ke dua, anda harus mempunyai 2 buah file, sama seperti contoh di atas sebelumnya, yaitu: popup1.html digunakan untuk membuat link dan function popup nya, dan popup2.php adalah file yang kita panggil.

Berikut ini admin akan berikan script yang lain untuk membuat pop up , disini hanya script nya yang berbeda. perhatikan dibawah ini , kita membuat function di popup1.html :

<script type="text/javascript" language="javascript">
function PopupCenter(pageURL, title,w,h) {
var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
}
</script>

dan untuk memanggil pop up di link berikut contohnya :

<a onclick=\"PopupCenter('popup2.php', 'myPop1',800,400);\" href=\"javascript:void(0);\" style=\"text-decoration:none\">info writings</a>

Sekian dulu artikel Cara Membuat POP up window dengan Javascript , semoga artikel ini dapat bermanfaat

Artikel Terkait

Diskusi