Codins - Sebelumnya kita telah belajar mengenai effect pada jquery yang bisa anda baca kembali pada artikel berjudul Belajar jQuery : Effect Pada jQuery dan Contoh Penggunaanya. Berikutnya kita akan belajar mengenai callback function pada jquery.
Secara singkat callback function pada jquery bisa diartikan sebagai function yang dieksekusi setelah sebuah effect selesai dijalankan. Misal kita akan membuat efek slideUp pada sebuah kotak, ketika efek pada kotak tersebut selesai dijalankan, maka berikutnya jquery akan menjalankan function yang sudah kita tentukan, ini dinamakan sebagai callback function.
Membuat Callback Function jQuery
Untuk membuat sebuah callback function pada jquery caranya cukup mudah, pertama buat sebuah file bernama callback.html kemudian anda isikan sintaks dibawah kedalam file tersebut :
callback.html
Penjelasan sintaks diatas :
- kita akan menampilkan gambar setelah kita menjalankan efek slideUp pada kotak berwarna biru
- kita buat class gambar kemudian isikan css display : none untuk menyembunyikan gambar
- setelah itu gunakan selector jquery untuk memilih button dengan id tombolshow, kemudian kita berikan event click pada tombol tersebut
- selanjutnya kita berikan efek slideDown pada div class kotak, setelah efek dijalankan kita akan menampilkan tag img dengan class gambar
$('.kotak').slideDown(800,function(){
Pada sintaks yang saya garis bawahi diatas, jika kita ingin menggunakan callback function maka cara penulisannya adalah$('.gambar').show();});
$('.kotak').namaEfek(waktu dalam milisecond, function(){Jika anda berhasil maka hasilnya akan seperti berikut ini :
//function yang akan dijalankan, misal menampilkan gambar
$('.gambar').show();
});
See the Pen bMoKRL by Memem (@inoorsetyo) on CodePen.
Sampai disini terlebih dulu tutorial berjudul Belajar jQuery : Callback Function dan Cara Menggunakannya. Semoga bermanfaat, terimakasih!
Belajar jQuery : Callback Function dan Cara Menggunakannya
4/
5
Oleh
Ikhwan
