Hallo teman – teman berjumpa kembali dengan saya di artikel tips dan trik Dumet School, pada kesempatan kali ini saya akan memberikan tips dan trik tentang Cara Menggunakan Fungsi hide() dan show() Pada jQuery Kenapa harus menggunakan jQuery..??
Jawabannya pasti yaa.. karena dengan menggunakan jQuery kita dapat membuat sebuah layout yang menarik dan interaktif, seperti judul dalam artikel kali ini saya akan mengenalkan dua fungsi yaitu show() dan hide(). Di mana fungsi ini berguna untuk menyembunyikan dan menampilkan konten, pada latihan kali ini kita akan membuat sebuah image dan kemudian kita akan menggunakan kedua fungsi tersebut untuk 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 pada browsernya. Maka hasilnya seperti gambar di bawah ini
Langkah berikutnya kita berikan fungsi jQuery nya, pertama – tama load terlebih dahulu library jQuery nya teman – teman bisa ambil di website resminya di jQuery.com lalu letakkan di dalam tag <head>
Jika sudah baru kita berikan fungsi hide() dan show() nya
$(document).ready(function(){
$("#hide").click(function(){
$("img").hide();
});
$("#show").click(function(){
$("img").show();
});
});
Letakkan script jQuery nya di dalam tag <head>, jika sudah. Save dan refresh pada browsernya lalu tekan tombol hide dan show, jika berhasil maka image akan di hide dan show jika button di klik. Tetapi untuk hide dan shownya terlalu cepat sekali sehingga tidak ada kesan indahnya. Biar ada kesan ada slow nya kita berikan kecepatannya
Seperti teman – teman lihat pada gambar di atas ini yang saya beri lingkaran berwarna orange saya berikan kecepan 2000 ms maka pada proses hide dan show nya akan mempunyai slow selama 2 detik. Teman – teman ikuti seperti gambar di atas ini jika sudah save dan refresh pada browsernya maka hasilnya seperti yang saya bilang ada kecepatan selama 2 detik dalam proses hide() atau show() nya. Sangat mudah bukan..??
Baik, sekian pada artikel kali ini tentang Cara Menggunakan Fungsi hide() dan show() Pada jQuery kita berjumpa kembali pada artikel berikutnya. Teman – teman bisa experimen sendiri dari hasil latihan kali ini dengan menggunakan fungsi show() dan hide().
Semoga bermanfaat, terimakasih dan sampai jumpa.
The post Cara Menggunakan Fungsi hide() dan show() Pada jQuery appeared first on Kursus Website Terbaik.