Membuat Rotasi Background Image

Tips Membuat Rotasi Background Image : Jika menginginkan, dengan beberapa image yang kita miliki, kita dapat membuat background image yang berubah-ubah (berotasi) secara bergantian ketika pengunjung berusaha me-refresh (me-load) beberapa kali blog kita. Dengan tampilan background yang berubah-ubah tersebut mungkin dapat membuat pengunjung lebih betah berlama-lama pada blog kita karena mendapatkan sajian background yang tidak monoton dan itu-itu saja. Jika tertarik silakan ikuti tipsnya bersama Tips dan Trik Blog berikut ini.

Langkah-langkahnya adalah sebagai berikut.

Pertama, upload image-image yang akan kita jadikan sebagai background ke image hosting terlebih dahulu.

Kedua, login ke account blogger hingga masuk Dasbor >> Tata Letak >> Tambah Gadget >> Tambahkan HTML/Javascript

Ketiga, copy kode berikut ini

<script type="text/javascript">
var banner= new Array()
banner[0]="URL_Image01"
banner[1]="URL_Image02"
banner[2]="URL_Image03"
banner[3]="URL_Image04"
banner[4]="URL_Image05"
banner[5]="URL_Image06"
banner[6]="URL_Image07"
banner[7]="URL_Image08"
banner[8]="URL_Image09"
banner[9]="URL_Image10"
var random=Math.floor(10*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + banner[random] + '") repeat center center;');
document.write(" }");
document.write("</style>");
</script>

Keterangan

• Ganti URL_Image01 hingga URL_Image10 dengan URL_image kita.
• Jika menghendaki jumlah image yang berbeda, kita tinggal menambahkan atau menguranginya sendiri. Misalkan kita hanya menghendaki 5 image maka hapuslah banner[4] hingga banner[9]. Namun sebaliknya jika dirasa masih kurang, kita dapat menambahkannya mulai banner[10] hingga seterusnya.
• Kemudian gantilah angka 10 sesuai dengan jumlah image yang ingin kita gunakan, misalkan image-nya hanya 5 buah maka gantilah menjadi angka 5 begitu juga jika kita menginginkan 20 buah image maka gantilah menjadi 20.

Contoh aplikasinya, seperti di bawah ini.

<script type="text/javascript">
var banner= new Array()
banner[0]="http://www.geocities.com/yono_pati/intan.gif"
banner[1]="http://www.geocities.com/yono_pati/bunga.gif"
banner[2]="http://www.geocities.com/yono_pati/bisnis.gif"
var random=Math.floor(3*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + banner[random] + '") repeat center center;');
document.write(" }");
document.write("</style>");
</script>

Keempat, simpan perubahan

Kelima, selesai

Sekarang, cobalah refresh blog beberapa kali dan pastikan background imagenya berubah-ubah.

(sumber : tips for new bloggers)

Description: Membuat Rotasi Background Image Rating: 4.5 Reviewer: Unknown - ItemReviewed: Membuat Rotasi Background Image