Cara Membuat Gambar Hide dan Show Menggunakan jQuery dan CSS

Hallo teman-teman DUMET School ketemu lagi dengan saya, pada kesempatan kali ini saya akan mengajarkan bagaimana caranya membuat gambar hide dan show menggunakan jQuery dan CSS. Membuat gambar hide dan show maksudnya adalah gambar yang di buat setengah dan ketika di klik tombol show baru akan muncul gambar keseluruhannya. Biasa nya teknik ini di gunakan untuk kalian yang ingin membuat website dengan scroll tidak terjauh ke bawah ketika di scroll. Untuk membuat nya sangat mudah sekali, kita akan menggunakan perintah jQuery yaitu mouseover, mouseout dan peintah-perintah CSS. Oke kita langsung praktekkan saja ya teman-teman.

Pertama kalian bisa buat struktur HTML nya seperti berikut.

Kemudian CSS nya kalian bisa ikuti gambar di bawah ini

Dan Perintah jQuerynya berikut ini

Maka Hasilnya seperti ini.

Download

Semoga artikel Cara Membuat Gambar Hide dan Show Menggunakan jQuery dan CSS bermanfaat untuk kalian.