Hallo sahabat Dumetschool, semoga selalu dalam keadaan sehat dan selalu semangat ya. Dalam kesempatan kali ini saya akan membahas tentang efek hover yang nanti di berikan pada suatu gambar. Nah efek hover disini dimana ada suatu gambar saat di hover maka gambar akan berubah. Tentu saya akan menggunakan bantu event javascript. Oke kalau begitu langsung saja simak cara membuatnya seperti langkah-langkah dibawah ini:Langkah pertama siapkan text editor untuk mengetikkan code seperti dibawah ini:

Jadi pada script diatas saya hanya menggunakan 1 buah div dengan nama class=”box”, lalu selanjutnya sahabat bisa siapkan 2 gambar yang nanti diberikan efek hover, saya disini menggunakan 2 gambar dibawah ini:

Cara Mengubah Gambar Dengan Efek Hover

Langkah selanjutnya menambahkan tag img untuk gambar yang sudah disiapkan tadi seperti code berikut ini:

Cara-Mengubah Gambar Dengan Efek Hover

code diatas ada suatu event onmouseover dimana saat mouse berada dekat pada object gambar akan menuju gambar 2 dan saat mouse dijauhkan atau eventonmouseout maka gambar aka kembali lagi menampilkan gambar 1.

Saya kira cukup dalam pembahasan kali ini semoga bermanfaat serta memberikan tambahan referensi belajar, sampai jumpa lagi dengan pembahasan lainnya.

terima kasih