Jquery merupakan sebuah library javascript yaitu berupa kumpulan kode-kode javascript yang siap pakai. Lalu hadir lah sebuah jquery-ui atau jquery user interface dimana bertujuan untuk mengembangkan aplikasi berbasis website dari segi user interface atau bisa dibilang khusus pada bagian front-end.
Pada kesempatan kali ini kita akan membahas tentang Cara Penggunaan effect() pada Gambar menggunakan Jquery-ui. Jquery-ui menyediakan banyak sekali fitur-fitur yang dapat kita gunakan dalam mengembangkan aplikasi kita terutama pada bagian front-end dan teman-teman dapat melihat dan mempelajari fitur-fiturnya diwebsite resminya yaitu http://jqueryui.com.
Namun dipembahasan kali ini kita hanya membahas salah satu fitur yang terdapat pada jquery-ui yaitu effect(). Sebenarnya effect() juga ada pada jquery namun saya disini menggunakan jquery-ui lebih praktis dan mudah.
Sebagai contoh mari kita praktekan, buatlah folder terlebih dahulu, kemudian siapkan sebuah gambar dan letakan didalam folder tsb. Disini saya menggunakan gambar dibawah ini :
Jika sudah, langkah selanjutnya jalankan/run text-editor yang teman-teman gunakan, lalu ketiklah script seperti pada gambar dibawah ini :
Jika sudah, penjelasan pada kode diatas kita membutuhkan sebuah library jquery dan jquery-ui, lalu kita tambahkan sedikit style untuk merubah jenis cursor dan ketika kita klik maka kita berikan effect/animasi berupa explode pada element gambar tsb.
Jika sudah simpan, kemudian silahkan coba teman-teman jalankan/run dibrowser yang teman-teman gunakan. Maka hasilnya akan menjadi seperti pada gambar dibawah ini :
Dari hasil gambar diatas merupakan sebuah effect explode yang sudah disediakan oleh jquery-ui. Untuk kedepannya silahkan teman-teman baca baca diwebsite resminya jquery-ui disana sudah disediakan berbagai macam animasi.
Oke kalau begitu cukup sekian pembahasan kali ini tentang Cara Penggunaan effect() pada Gambar menggunakan Jquery-ui. Semoga bermanfaat dan sampai bertemu dipembahasan selanjutnya.
Terimakasih