Rolling Images JavaScript

Pernahkan anda melihat baner web yang berubah secara otomatis dari gambar 1 ke gambar lain???ok saya akan mencoba memberikan sedikit tutorialnya,ketikan script pada notepad sbb:

baner.html

<html>

<head>

<title>TestPage</title>

<style> #header { width: 400px; height: 200px; } </style>

</head>

<body>

<div id="header">baner</div>

<!-- sisipkan javascriptnya di sini -->

</body>

</html>

Save script di atas dengan nama baner.html
JavaScriptnya Sbb:
<script language="javascript">

var i = 0; // counter

var t = 3000; // waktu 3 detik

var p = new Array(

'http://www.google.com/intl/en/images/sitesearch/bsd.gif',

'http://www.google.com/intl/en/images/sitesearch/linux.gif');

function showImage()

{ if (i == p.length) { i = 0; }

document.getElementById('header').style.backgroundImage = "url('" + p[i] + "')";

i++; setTimeout('showImage()', t);

}

showImage();

</script>

Hasilnya lihat disini

selamat mencoba ;)

Diposting oleh .::4ndh1-0nL1n3::. Label: di 2:47:00 PM  

0 komentar:

Posting Komentar