Slide Image dengan javascript dan html

haloo semua, bertemu lagi. Kali ini saya akan berbagi cara, bagaimana membuat image slide dengan javascript pada file hmtl atau website atau blog, tinggal dicustom aja sesuai kebutuhan. :)

pertama, kita ketikkan script berikut diatas tag </head>:

<script type="text/javascript">
<!-->
var image1=new Image();
var image2=new Image();
image1.src="source image1.jpg";
image2.src="source image2.png";
//-->
</script>

kemudian tambahkan kode dibawah ini untuk tag body / contentnya ya:

<div> <img src="source image 1.jpg" name="slide" alt="" width="960" height="326" /></div> 
<script type="text/javascript"> 
//yang ini untuk tampilan pertama ketika diload 
var step=1;        
function slideit(){ 
document.images.slide.src=eval("image"+step+".src");     
if(step<2)        
step++;        
else        
step=1;        
setTimeout("slideit()",3000);        
}        
slideit();
</script>

Berikut kira-kira tampilan hasil kode di atas ketika dijalankan pada browser:

Nah, sudah jadi. Gampang kan. Selamat mencoba.

Tag: slide show foto html, membuat slide image dengan javascript dan html, membuat slide show foto pada website, mempercantik website dengan slide photo