Membuka popup dengan tag link

Pada Artikel yang lalu kita telah membahas cara membuka windows baru (popup) dengan java script. Kali ini kita akan membuat sebuah link html yang akan membuka sebuah popup.

Untuk membuat sebuah link bisanya kita menggunakan tag <a href="alamat dituju">text</a>. Nah kali ini kita akan membuat tag link tersebut membuka fungsi java script yang akan membuka sebuah popup.


Langkah pertama kita akan membuat fungsi javascript yang membuka popup terlebih dahulu:

<script>
var mywin; 
function popup_window()
{       mywin=window.open("http://adfoc.us/20014335795582","_blank","toolbar=yes,location=yes,menubar=yes,copyhistory=yes,directories=no,status=no,resizable=no,width=500,height=400"); 
}
</script>

Silakan ubah 'http://adfoc.us/20014335795582'  dengan alamat url yang akan kita buka.
Langkah berikutnya membuat tag link yang digunakan membuka fungsi tersebut. Untuk tag link, href kita isi tanda '#' ditambah event onClick='fungsi yang dibuka'.

<form>
<a href='#' onclick="popup_window()">click disini untuk membuka popup</a>
</form>

Hasil dari script diatas akan seperti berikut:
click disini untuk membuka popup

Nah coba klik link diatas makan popup akan terbuka.

Read More

3 comments

Deteksi browser PC dan Mobile menggunakan PHP

Terkadang kita membutuhkan informasi di perangkat apa halaman web kita dibuka, apakah di browser pada komputer atau di browser pada handphone. Tentunya kedua perangkat tersebut membutuhkan penanggulangan yang berbeda dalam menampilkan halaman web.

Untuk mendeteksi browser apa yang dipakai, bisa menggunakan fungsi $_SERVER['HTTP_USER_AGENT'] pada PHP. Secara otomatis fungsi tersebut akan memberikan informasi yang akurat bagi kita.

<?php

      echo $_SERVER['HTTP_USER_AGENT'];

?>

Coba kita buat script sederhana seperti diatas dan simpan dalam file contoh1.php. Lalu buka file contoh1.php tersebut dengan menggunakan browser google chrome. Apa yang terjadi?  Maka akan didapat informasi tentang browser yang kita gunakan contohnya : Mozilla/5.0 (Windows NT 6.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.57 Safari/537.36

Untuk lebih menyederhanakan pencarian browser atau perangkat apa yang kita gunakan, kita bisa menggunakan fungsi yang bisa mencari suatu kata yang kita cari pada suatu subjek string, apabila ada yang cocok maka kata tersebut akan disimpan dalam variabel. Fungsi tersebut adalah fungsi preg_match(string pattern, string subject, match)

contohnya : 

Mencari kata chrome pada $_SERVER['HTTP_USER_AGENT']

<?php

if (preg_match('/(chrome)/i', $_SERVER['HTTP_USER_AGENT'], $version))

    echo $version[1];

?>

Apabila script diatas di buka di browser google chrome maka akan menghasilkan informasi 'chrome'

Mencari kata firefox pada $_SERVER['HTTP_USER_AGENT']

<?php

if (preg_match('/(firefox)/i', $_SERVER['HTTP_USER_AGENT'], $version))\

      echo $version[1];

?>

Apabila script diatas di buka di browser firefox  maka akan menghasilkan informasi 'firefox '

atau kita juga bisa menggabungkan string pattern yang ada dengan tanda |

<?php

if (preg_match('/(chrome|firefox)/i', $_SERVER['HTTP_USER_AGENT'], $version))\

      echo $version[1];

?>

Script diatas bila dibuka di browser firefox atau chrome maka akan menghasilkan informasi browser masing-masing.

Bagaimana dengan browser pada Android, Iphone, Blackberry dan lain-lain?? Tentu saja bisa kita tinggal menambah String Pattern yang dibutuhkan. Berikut contoh yang lebih banyak dalam mendeteksi browser dan perangkat:

<?php

if (preg_match('/(chrome|firefox|avantgo|blackberry|android|blazer|elaine|hiptop|iphone|ipod|kindle|midp|mmp|mobile|o2|opera mini|palm|palm os|pda|plucker|pocket|psp|smartphone|symbian|treo|up.browser|up.link|vodafone|wap|windows ce; iemobile|windows ce; ppc;|windows ce; smartphone;|xiino)/i', $_SERVER['HTTP_USER_AGENT'], $version)) 

echo $version[1];

?>

Silakan dicoba pada perangkat Android, Iphone dan lainnya. Mudah-mudahan bisa mencerahkan dan menambah wawasan dalam belajar membikin website kali ini.

Read More

3 comments

Membuka windows baru dengan javascript

Kemampuan javascript lainnya yang sering digunakan dalam pembuatan website yaitu membuka windows baru. Kita bisa membuka dokumen html lainnya ke windows yang baru.

Tampilan windows yang kita buka pun bisa kita atur apakah windows memiliki statusbar, toolbar, menubar serta ukurannya pun bisa kita atur sendiri. Berikut ini merupakan sebuah contoh script dalam membuka windows baru dengan ukuran 500x400, tidak memiliki menubar, tidak memiliki statusbar dan juga tidak memiliki toolbar.

<html>
    <head>
              <script language="JavaScript">
                    function bukaWindows{
                                   myWin=open("hallain.html","displayWindow","width=500,height=400,status=no,toolbar=no,menubar=no");
                   }
              </script>
    </head>
    <body>
           <input type="button" value="Membuka window baru" onClick="bukaWindows()" >
    </body>
</html>

Pada script diatas terlihat sebuah fungsi javascript yang berfungsi untuk membuka sebuah window baru yang berisi dokumen hallain.html. Fungsi tersebut dibuka dengan cara mengklik sebuah tombol button dengan 'bacaan membuka window baru', bila tombol button tersebut kita klik maka sebuah window baru akan muncul.

Nah mudah-mudahan script tersebut bisa berguna bagi yang ingin membuat website dengan menggunakan fasilitas javascript yang lebih cepat dan tidak membebani server tentunya.

Read More

1 comment