Cara Menggunakan Fungsi hide() dan show() Pada jQuery
Hallo teman – teman berjumpa kembali dengan saya di artikel tips dan trik Source Code Aplikasi, di kesempatan kali ini saya akan memberikan tips dan trik mengenai Cara Menggunakan Fungsi hide() dan show() Pada jQuery Kenapa mesti menggunakan jQuery..??
Jawabannya pasti yaa.. karena dengan menggunakan jQuery kita dapat membangun sebuah layout yang menarik dan interaktif, seperti judul pada artikel kali ini saya akan mengenalkan dua manfaat yaitu show() dan hide(). Di mana manfaat ini bermanfaat bagi menyembunyikan dan menampilkan konten, di latihan kali ini kita akan membangun sebuah image dan kemudian kita akan menggunakan kedua manfaat tersebut bagi menyembunyikan dan menampilkan imagenya. Sebelum kita mulai teman – teman siapkan terlebih dahulu image nya dan text editornya. Baru kita akan implementasikan Cara Menggunakan Fungsi hide() dan show() Pada jQuery, teman – teman ketikkan script html nya seperti gambar di bawah ini
Dan kemudian save dengan nama index.html, lalu jalankan di browsernya. Karenanya hasilnya seperti gambar di bawah ini
Langkah berikutnya kita berikan manfaat jQuery nya, pertama-tama – tama load terlebih dahulu library jQuery nya teman – teman dapat ambil di laman resminya di jQuery.com lalu letakkan di pada tag <head>
Sekiranya telah baru kita berikan manfaat hide() dan show() nya
$(document).ready(function(){
$(#hide).click(function(){
$(img).hide();
});
$(#show).click(function(){
$(img).show();
});
});
Letakkan script jQuery nya di pada tag <head>, kalau telah. Save dan refresh di browsernya lalu tekan tombol hide dan show, kalau berhasil karenanya image akan di hide dan show kalau button di klik. Tetapi bagi hide dan shownya terlalu cepat sekali sehingga tak ada kesan indahnya. Biar ada kesan ada slow nya kita berikan kecepatannya
Seperti teman – teman lihat di gambar di atas ini yang saya beri lingkaran berwarna orange saya berikan kecepan 2000 ms karenanya di proses hide dan show nya akan mempunyai slow dalam rentang waktu 2 detik. Teman – teman ikuti seperti gambar di atas ini kalau telah save dan refresh di browsernya karenanya hasilnya seperti yang saya bilang ada kecepatan dalam rentang waktu 2 detik pada proses hide() atau show() nya. Betul-betul gampang bukan..??
Bagus, demikianlah di artikel kali ini mengenai Cara Menggunakan Fungsi hide() dan show() Pada jQuery kita berjumpa kembali di artikel berikutnya. Teman – teman dapat experimen sendiri dari hasil latihan kali ini dengan menggunakan manfaat show() dan hide().
Semoga bermanfaat, terimakasih dan hingga jumpa.
Sumber https://kursuswebsite.org
