Blog campur-campur

Mari bermain Lightbox 2.0

Fahmi Rizwansyah says:

Menampilkan image atau gambar menggunakan lightbox membuat website kita terlihat keren (menurutku lho...!). Untuk itu aku share aja ma sobat-sobat bloggerku tercinta.

Tambahkan beberapa kode javascript pada html blogspot kamu, caranya tinggal buka edit html di tab layout setup, cari/search kata "/head", kemudian sisipkan kode script dibawah ini di atas tag penutup tersebut.

<$Script src='http://www.lagunabiru.com/lg_scripts/js/prototype.js' type='text/javascript' /$>
<$Script src='http://www.lagunabiru.com/lg_scripts/js/scriptaculous.js?load=effects,builder' type='text/javascript' /$>
<$Script src='http://www.lagunabiru.com/lg_scripts/js/lightbox.js' type='text/javascript' /$>
<$link href='http://www.lagunabiru.com/lg_scripts/css/lightbox.css' media='screen' rel='stylesheet' type='text/css' /$>
*Jangan lupa untuk menghilangkan tanda dolarnya yach

Selanjutnya tambahkan attribut rel="lightbox" pada image link yang mau kamu buka.
contohnya:
<$a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1<$/a>
*Sekali lagi hapus tanda $-nya yach


Tarrraaaa, jadi dech
Lihat contohnya:

Kalo mau buat slide show, ini contoh scriptnya:
<$a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1<$/a>
<$a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2<$/a>
<$a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3<$/a>
*Sekali lagi aku mohon dengan sangat, hapus tanda $-nya yach


Semoga berguna,
Cheers, frizzy.