- Back to Home »
- Aplikasi Mobile , CSS , framework , hold , html5 , JavaScipt , jQuery , Mobile , orientasi , responsif. , tap , taphold »
- jQuery Mobile - Untuk Aplikasi Mobile Yang Lebih Baik (Part 1)
Baiklah, pada kesempatan kali ini saya ingin menjelaskan tentang sebuah Framework yang bernama "jQuery Mobile". jQuery Mobile merupakan framework hasil pengembangan dari jQuery dan jQuery-UI. Dasar pengembangan jQuery ini adalah untuk memberikan tampilan yang lebih baik dan responsif dari sebuah web ketika dibuka dari lingkungan perangkat berjalan (Mobile).
Pengembangan jQuery mobile ini memang memberikan perhatian lebih pada pemanfaatan fitur-fitur sentuh yang ada pada Smartphone. Misalkan pendeteksian orientasi device, menangkap event "Tap" atau "Tap & Hold". Semua itu memang ditujukan agar pengembangan aplikasi mobile menjadi lebih baik dan memberikan kenyamanan bagi para pengguna.
Kali ini saya akan menjelaskan tentang penggunaan event "Tap" dan "Tap & Hold"
1. Siapkan struktur lengkap dari jQuery seperti gambar berikut.
2. Buat file index.html yang berisi kodingan berikut.
3. Perhatikan pada saat penulisan ID dari masing-masing element HTML. Perhatikan pada tag Script. Didalam itulah dituliskan jQuery yang akan kita gunakan untuk menerima event Tap dan TapHold. Perhatikan script berikut.
Ini adalah gaya penulisan pada jQuery untuk menghandle event Tap dan TapHold Tersebut. Kemudian akan dijalankan perintah Alert untuk tap dan perintah mobile.changePage untuk TapHold. Apabila teman-teman belum mengerti gaya penulisan pada jQuery, bisa lihat ke Sini atau ke Sini untuk info lebih lengkap mengenai jQuery.
4. Simpan halaman index.html tersebut dan coba akses dari perangkat mobile. Maka hasilnya lebih dan kurang seperti ini.
Untuk perihal lain mengenai data-role, data-icon, header, footer. Akan dijelaskan pada postingan berikutnya...
Kalo ada yang ingin ditanyakan silahkan komen pada Comment Box... :D
Dengan jQuery, Happy Coding!