Bagaimana membuat gambar/image slideshow dengan JavaScript ?.
Disini saya memberikan contoh script tanpa harus bermain dengan Flash, Slideshow beberapa image akan terlihat lebih halus perpindahan image 1 ke image yang lainnya.
sumber: http://www.putrariau.com/
Copy kan 3 image dengan ukuran yg sama ke dalam folder dimana kita menempatkan file html yang akan kita buat.
example :
- gbr01.jpg
- gbr02.jpg
- gbr03.jpg
Sisipkan script berikut diantara <head> </head> :
<script language="JavaScript" type="text/javascript" src="fade.js"></script>
Sebelumnya, Anda bisa download script fade.js dan copykan dalam folder dimana file html diletakkan.
Sisipkan script berikut diantara <body> </body> :
<div style="background-image: url(gbr01.jpg); background-repeat: no-repeat;"
id="GambarBackground">
<img style="opacity: 0;" ilo-full-src="gbr01.jpg" alt="slide show"
src="gbr01.jpg" id="GambarDasar" width="250" height="166">
</div>
Setelah itu sisipkan script berikut untuk pemanggilan slideshow :
<script type="text/javascript">
RunSlideShow("GambarDasar","GambarBackground","gbr01.jpg;gbr02.jpg;gbr03.jpg",3);
</script>
Variabel nilai 3 pada pemanggilan RunSlideShow merupakan waktu delay tampil per image dalam second/detik.
berikut hasil tampilan Slide show : fade.htm
sumber : http://www.putrariau.com/2010/02/image-slideshow-dengan-javascript.html
Thanx To
My Facebook
 |
 |