Membuat Image Website Slideshow

Hai blogger, berikut tutorial singkat mengenai membuat image slideshow di website. Kita bisa menggunakan funsi javascript yakni slideshow.js atau bisa men-create fungsi sendiri.
Pertama, tentukan berapa banyak gambar yang ingin dibuat slideshow (dalam contoh ini, saya buat 3 gambar).

var image1=new Image()
image1.src=”image1.gif”
var image2=new Image()
image2.src=”image2.gif”
var image3=new Image()
image3.src=”image3.gif”

Ekstensi image tidak harus berakhiran gif, boleh menggunakan format image lain seperti .jpg, .png, dll.
Untuk membuat lebih dari 3 image (mis image 4), tinggal tambahkan

var image4=new Image()
image4.src=”image4.gif”

dan seterusnya.

Berikut, sertakan potongan script ini di dalam body html/web anda.

<script>
//width dan height dapat diubah sesuai dengan kebutuhan
//variable that will increment through the images
var step=1
function slideit(){
//create fungsi js slideshow
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval(“image”+step+”.src”)

if (step<3)

step++

else

step=1

//call function “slideit()” every 2 seconds

setTimeout(“slideit()”,2000)}

slideit()

</script>

Semoga bermanfaat.😀

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s