[+] Post Title :
[+] Date : Rabu, 01 Februari 2012
[+] Author : šëHëR!êž Hⁿc
[+] Link : http://seherieshnc.blogspot.com/2011/06/random-banner-or-image-with-link.html
[+] Type : No Type
Random Banner Or Image With Link Javascript
[+] Date : Rabu, 01 Februari 2012
[+] Author : šëHëR!êž Hⁿc
[+] Link : http://seherieshnc.blogspot.com/2011/06/random-banner-or-image-with-link.html
[+] Type : No Type
Jika sebelumnya ada postingan saya mengenai Random Mp3 Player Script dan Random Text Javacript, kali ini saya mau share tentang Random Banner Or Image Javascript. Tentu fungsinya sudah pada tahu, yaitu menampilkan gambar yang sudah kita setting sebelumnya secara acak. Mungkin masih ada yang belum mengerti ? . Ok langsung saja ke script nya .<script language="JavaScript">Perhatikan tulisan URL BLOG bold merah di atas. Ganti tulisan tersebut dengan link blog kamu, atau link apa saja yang ingin kamu kaitkan. Perhatikan juga tulisan URL IMAGE bold biru di atas, ganti dengan url atau link gambar yang ingin kamu tampilkan . Sedangkan angka 4 bold merah adalah jumlah gambar yang ingin kamu tampilkan.
images = new Array(4);
images[0] = "<a href = 'URL BLOG'><img src='URL IMAGE' alt='blog'></a>";
images[1] = "<a href = 'URL BLOG'><img src='URL IMAGE' alt='blog'></a>";
images[2] = "<a href = 'URL BLOG'><img src='URL IMAGE' alt='blog'></a>";
images[3] = "<a href = 'URL BLOG'><img src='URL IMAGE' alt='blog'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
Berikut ini adalah contoh di mana saya menggunakan 3 gambar yang berbeda. Yang link nya saya arahkan ke http://p-cbn.blogspot.com/ . Berikut script yang saya gunakan :
<script language="JavaScript">Jika scirpt di atas di pasang maka hasilnya akan seperti di bawah ini. Silahkan refresh page nya beberapa kali untuk melihat gambar yang lain.
images = new Array(3);
images[0] = "<a href = 'http://www.p-cbn.blogspot.com/'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmfmhhTTunSn2e3wZiFoJzkNNlxP0htd14r6ws-4CsGKJvOf1o7lSdOZwGq1oi-1hhe3vZ2QNrusktVpEP_1945vvAQIhrpENo8sbmx8VKXL4_m0YmI2lAMnRNL8PGlrB7WygcCxColgAd/s1600/banner.png' alt='p4r46hcyb3rn3t'></a>";
images[1] = "<a href = 'http://www.p-cbn.blogspot.com/'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-Ga3JN5SMcPe8m6bpOjv566Q0Eu59ZoX85mkYMo5pQq8G7H_e2a0Z5dPelMdrI0zGXt9BBOMxvjhHMUQewJZi1TQgxzOlxNlP3gu5Ik23cTwmiubKITbzr2YLcPPj4JP94J1A-B5RiXo/s1600/logo.png#39; alt='p4r46hcyb3rn3t'></a>";
images[2] = "<a href = 'http://www.p-cbn.blogspot.com/'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm9r5MzlqSDYw6OiE4UJk379ve64W8-4hTaw-OvBqap-rVDLV1GiR3xuM3tj0OngZohvfOL6E2LZg4dfJcfR9_VY8KM1ul6WUQW-4t7Y1G8eL0UCj3AyASsmnNem4mtN5bpG7VU39vQWE/s1600/logo3.png' alt='p4r46hcyb3rn3t'></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>
DEMO : ------------------------------------------------------------------------------
------------------------------------------------------------------------------
Bagaimana ? menarik bukan. Untuk menerapkannya cukup terapkan script tersebut dalam tag <body> di mana kamu akan menampilkan gambar yang kamu inginkan. Good Luck dan semoga berguna ;)
credit : http://www.computerhope.com
0 komentar:
Posting Komentar