Update Terbaru
Loading...
Home » , » Cara Membuat Gambar Berubah di Setiap Halaman Blog
Published On : Kamis, 18 Oktober 2012
01.27.00 | Admin | 1 comment

Cara Membuat Gambar Berubah di Setiap Halaman Blog


Setelah kita belajar tentang bagaimana membuat pesan teks berubah-ubah pada setiap halaman, bagaimana kalau saya beri tahu bagaimana caranya Membuat Gambar Berubah di Setiap Halaman Blog. Tips ini bisa Anda terapkan bagi Anda yang gemar memajang koleksi foto atau gambar guna menambah semaraknya tampilan blog. Mau lihat contohnya, yuk perhatikan contoh foto atau gambar dibawah ini :

Click Here

Foto atau gambar diatas akan berubah setiap kali Anda me-reload halaman ini. Berikut kode script yang digunakan, harap perhatikan dengan seksama kode dibawah ini :


<script language="JavaScript">
var img_width = "250";//lebar gambar
var img_height = "150";//tinggi gambar
var img_title = "klik donk";//teks yg muncul ketika mouse diarahkan pada gambar
var ad=new Array()

//masukan url foto atau gambar Anda disini
ad[0]='http://angelinasondakh.blogs.com/angelina_sondakhs_diary/images/puteri_indonesia_2001_3_5.jpg';
ad[1]='http://www.indonesiaindonesia.com/imagehosting/images/2821/1_Agni_Pratistha_puteri_indonesia.jpg';
ad[2]='http://www.batamevent.com/gbr%20artikel/putri%20indonesia.jpg';
ad[3]='http://www.suaramerdeka.com/harian/0608/26/sm1hl26path.jpg';
ad[4]='http://www.undiknas.ac.id/wp-content/uploads/2007/08/puteri-indonesia-2007.jpg';

var links=new Array()
//masukan link tujuan / kosongkan juga boleh
links[0]='#';
links[1]='#';
links[2]='#';
links[3]='#';
links[4]='#';
/*
edit by http://www.masbugie.com
*/
var xy=Math.floor(Math.random()*ad.length);
document.write('<a href="'+links[xy]+'" target="_blank"><img src="'+ad[xy]+'" width="'+img_width+'" height="'+img_height+'" alt="'+img_title+'"></a>');
</script>

Note :
-Pada teks yang berwarna merah silahkan Anda sesuaikan dengan keinginan Anda.
-Link tujuan adalah alamat link yang akan muncul ketika pengunjung meng-klik gambar tersebut atau bisa juga Anda samakan dengan url gambar tersebut.

Caranya pasangnya :
1. Login ke blogger -> Rancangan -> Tambah Gadget->Javascript/Html
2. Silahkan Copy kode diatas dan Paste didalamnya . Selesai

TIPS TRIK TUTORIAL BLOG PROFESIONAL



Related Post

1 komentar:

Referensi : DTE | MDF Blog | MKR Site
Copyright © 2013. Gembulz Blog's - All Rights Reserved
Template Created by Creating Website Modify by Gembulz Blog's
Powered by Blogger Top