Cara Mudah Agar Gambar Berubah ketika disentuh (Hover Image)

Oleh. Kang Rian • 2 • Edit

Cara Mudah Agar Gambar Berubah ketika disentuh (Hover Image)

Pada kesempatan kali ini saya hanya sekedar ingin berbagi , bagaimana cara agar Gambar berubah ketika di sentuh / Hover Image :

1 . Siapkan 2 Gambar yang Akan kita jadikan Percobaan , contoh ke-2 gambar
dibawah :

Alamat Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Z7VccaU_pSPJIY5hgWnx8YdLWx4iXavebFhoKavhZwss9YbkcF-bUPHMN0knR95X2813R-DEUgl0S90bEcqAPtmnZWKTVBHByUmSnUU8IF84aov5l_pHv2fnxHwI_eO5OVIaqhdcc3uS/s200/4.jpg

Alamat Gambar :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi4wSpl6YSZUkPexxbWNkSzuE6BEWq9VKHy1gE2ZMDEnYB7a1tUxdJAYTAT-_4Eh1Fbj6tykVNFt6piOudjvwDgOYFyCCkxizuENXlGVfPiklmozDbepPxkkXKcDylr1MxRso5CEixUXrh/s200/3.jpg

2. Buat Kode HTML dengan memasukan Alamat Gambar di atas, seperti berikut :

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Z7VccaU_pSPJIY5hgWnx8YdLWx4iXavebFhoKavhZwss9YbkcF-bUPHMN0knR95X2813R-DEUgl0S90bEcqAPtmnZWKTVBHByUmSnUU8IF84aov5l_pHv2fnxHwI_eO5OVIaqhdcc3uS/s200/4.jpg" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi4wSpl6YSZUkPexxbWNkSzuE6BEWq9VKHy1gE2ZMDEnYB7a1tUxdJAYTAT-_4Eh1Fbj6tykVNFt6piOudjvwDgOYFyCCkxizuENXlGVfPiklmozDbepPxkkXKcDylr1MxRso5CEixUXrh/s200/3.jpg'" onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1Z7VccaU_pSPJIY5hgWnx8YdLWx4iXavebFhoKavhZwss9YbkcF-bUPHMN0knR95X2813R-DEUgl0S90bEcqAPtmnZWKTVBHByUmSnUU8IF84aov5l_pHv2fnxHwI_eO5OVIaqhdcc3uS/s200/4.jpg'"/>

Keterangan :

ONMOUSEOUT ( Adalah Perintah yang akan memanggil Gambar Pertama )

ONMOUSEOVER ( Adalah Perintah yang akan memanggil Gambar Kedua )

3. Contoh/Hasilnya akan Seperti dibawah ini ( Coba sentuh gambarnya ) :

Selamat Mencoba dan Semoga Berhasil .! #JustSHARE ..

Bagikan! Sent Share Tweet Pin it!

Kang Rian Ikuti

Web & Graphic Designer - Berpengalaman sejak 2010, fokus membantu Perusahaan / UMKM agar dikenal secara Global melalui Website Profesional & Desain yg Menjual.

Cek. Jasa-Design.web.id