JqueryUI adalah dibangun di atas library JavaScript jQuery yang kuat. UI singkatan dari interface / antarmuka pengguna. Itu adalah satu set plugin untuk jQuery yang menambah fungsionalitas baru ke library inti jQuery.
Termasuk yang mengatur plug-in di JqueryUI interface interaksi, efek, animasi, widget, dan tema-tema yang dibangun di atas jQuery JavaScript Library.
Postingan Terkait : Pengertian dan manfaat JavaScript dalam membangun Website
Rilis pertama sekali pada bulan September 2007, diumumkan dalam posting blog daro John Resig pada jquery.com. Rilis terbaru, 1.10.4, memerlukan jQuery 1,6 atau versi sesudahnya.
jQuery UI adalah perangkat lunak gratis, open source, yang berlisensi di bawah lisensi
MIT.
*Institut Teknologi Massachusetts (Massachusetts Institute of Technology atau MIT), adalah institusi riset swasta dan universitas yang terletak di kota Cambridge, Massachusetts tepat di seberang Sungai Charles dari distrik Back Bay di Boston, Amerika Serikat.
Fitur dari jQweryUI
JqueryUI dikategorikan ke dalam empat kelompok, Interactions, widgets, Effect, Utilities. Ini akan dibahas secara rinci dalam postingan berikutnya. Struktur library seperti ditunjukkan pada gambar di bawah ini:
- Interactions - Merupakan plugin yang interaktif seperti drag, drop, mengubah ukuran dan lebih yang memberikan pengguna kemampuan untuk berinteraksi dengan DOM elemen.
- Widgets - Menggunakan widget yang jQuery plugin, Anda dapat membuat elemen antarmuka pengguna seperti datepicker accordian, dll.
- Effect - ini dibangun pada efek internal jQuery.
- Utilities - ini adalah satu set tools modular librart JqueryUI digunakan secara internal.
*Document Object Model (DOM) adalah object model standar untuk HTML dan XML yang bersifat platform independent. Sebuah web browser tidak harus menggunakan DOM untuk menampilkan dokumen HTML. Namun DOM diperlukan oleh JavaScript yang akan mengubah tampilan sebuah website secara dinamis.
Manfaat dari JqueryUI
- APIs kohesif dan konsisten.
- Dukungan komprehensif Browser
- Open Source dan bebas untuk digunakan
- Dokumentasi yang baik, dan mudah ditemukan.
- Mekanisme tema yang powerfull.
- Stabil dan mudah dalam pemeliharaan.
Download JqueryUI
Sekarang kita akan download dan set up JqueryUI dari librari. Kami juga secara singkat akan mempelajari struktur direktori dan isinya. Perpustakaan JqueryUI dapat digunakan dalam dua cara halaman web Anda:
- Men-download library UI dari webiste resmi
- Men-download library UI dari CDNs
Download perpustakaan UI dari webiste yang resmi
Ketika Anda membuka link //jqueryui.com/, Anda akan melihat ada tiga opsi untuk men-download JqueryUI Perpustakaan:
- Costum Download - klik tombol ini untuk men-download versi yang disesuaikan pada library.
- Stable- klik tombol ini untuk mendapatkan versi librariy JqueryUI yang stabil dan terbaru.
- Legacy - klik tombol ini untuk mendapatkan rilis utama sebelumnya library JqueryUI .
Postingan Terkait
- Pengertian dan manfaat JavaScript dalam membangun Website
- Fitur dan Kinerja PHP 7
- Mengenal Bahasa Pemograman HTML
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 //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