Emely.Net Banner Exchange
Emely.Net Banner Exchange

 Home, Forum diskusi, Chatting, Download
Manipulasi Gambar

Sesuatu yang lebih menarik yang dapat anda lakukan dengan JavaScript adalah melakukan manipulasi gambar. Untuk melakukan hal ini anda membutuhkan browser Netscape 3.0+ atau IE4.0+.

Contoh berikut akan mendemontrasikan bagaimana anda dapat mengubah suatu image secara dinamis setelah halaman ini selesai di muat. Saya menggunakan dua gambar berikut untuk melakukan animasi secara pseudo (menggunakan kode program).


fanoff.gif
fan.gif

Ketika anda klik pada tombol  "On" , 'fan.gif' akan ditampilkan. Ketika anda klik "Off", 'fanoff.gif' akan ditampilkan. Perlu dicatat bahwa saya hanya mengganti gambar-gambar tersebut. Animasi tersebut terjadi karena  'fan.gif' adalah suatu GIF animasi.



Perhatikan pada kode JavaScript yang diperlukan agar ini bekerja:

<FORM> <IMG NAME="coolfan" SRC="fanoff.gif" width=61 height=72><BR><BR> <INPUT TYPE=BUTTON VALUE=" Off " onClick="coolfan.src = 'fanoff.gif'"> <INPUT TYPE=BUTTON VALUE=" On " onClick="coolfan.src = 'fan.gif'"> </FORM>

Pada <IMG> tag, bagian NAME="coolfan" ditambahkan supaya anda dapat mengacu pada image ini sebagai  coolfan dari JavaScript. Pada handler onClick dari tombol, kita dapat mengubah properti src dari image ke yang anda inginkan Ini akan membuat browser mengambil image baru dan ditampilkan menggantikan yang lama.

 

Image Rollovers

Anda mungkin pernah melihat sejumlah halaman web yang mana suatu gambar berubah ketika anda mengerakan mouse melewatinya. Hal ini dapat juga dilakukan dengan teknik diatas. Coba gerakan mouse melewati gambar dibawah. Klik padanya akan membawa anda ke halaman index.html.

Sekarang, perhatikan kode yang diperlukan untuk membuat link seperti yang di atas.

<A HREF="../javascript/index.html" onMouseOver="imgfan.src='fan.gif'" onMouseOut="imgfan.src='fanoff.gif'"> <IMAGE NAME="imgfan" SRC="fanoff.gif" WIDTH=61 HEIGHT=72 BORDER=0> </A>

Baca juga:
Magical MouseOver Maker dari About.com

Dibuat  oleh hendra@indoprog.com
Medan - Sumatera Utara
Indonesia