Popup url dengan fancybox

Cara membuat agar link url saat di klik maka akan popup dengan bantuan dari jquery dan fancybox...

Caranya sangat mudah...

Silahkan download terlebih dahulu script yang dibutuhkan:
1. Framework javascript Jquery
2. Jquery fancybox

Sudah download? Oke langkah-langkah yang harus dilakukan adalah sebagai berikut:
1. Masukan kode script dibawah diantara
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript">
</script>
    <script src="/js/fancybox-1.3.4/jquery.easing-1.3.pack.js" type="text/javascript">
</script>
    <script src="/js/fancybox-1.3.4/jquery.mousewheel-3.0.4.pack.js" type="text/javascript">
</script>
    <script src="/js/fancybox-1.3.4/jquery.fancybox-1.3.4.js" type="text/javascript">
</script>
    <link href="/js/fancybox-1.3.4/jquery.fancybox-1.3.4.css" media="screen" rel="stylesheet" type="text/css"></link>
// Fancybox for URL
$("#namelink").fancybox({
    'scrolling'        : 'no',
    'titleShow'        : false,
    'overlayOpacity'    : 0.9,
        'overlayColor'      : '#fff',
});
Keterangan script diatas:
#namelink adalah id link yang ingin dibuka secara popup
scrolling adalah ketika popup apakah box tersebut bisa di scroll kebawah atau fix (tetap ditempat)
titleShow adalah judul dari link yang ingin ditampilkan apakah mau ditampilkan di popup atau tidak
overlayOpacity adalah background opacity dari box tersebut overlayColor adalah warna dasar dari box tersebut

2. Beri tanda id pada link yang ingin dipopup
<a href="http://www.blogger.com/blogger.g?blogID=8104006414729830100#openpopup" id="namelink" title="New topic">Create new topic</a>
                        <br />
<div style="display: none;">
<div id="openpopup">
Isi konten anda yang ingin dipopup disini</div>
</div>

Isi konten anda yang ingin dipopup disini
keterangan script diatas:
id harus sama dengan trigger link pada header yaitu namelink (terserah mau pake nama apa)
title adalah judul dari link
href harus sama dengan id pada box yang ingin dibuka yaitu openpopup (terserah harus pake nama apa)
Oke setelah itu di save kemudian dicoba...

Berikut adalah contoh gambar untuk popup yang sudah saya buat:
URL yang ingin diklik




Ketika di klik maka akan keluar popup sebagai berikut:




Untuk contoh nyata silahakan klik link ini terus coba anda klik link create new topic... Bagi yang belum mengerti silahakan komentar nanti akan saya coba beberkan pada postingan ini..