Mudahnya Membuat FAQ dengan Jquery Mobile

Untuk membuat FAQ di jQuery Mobile kita akan menggunakan fungsi Collapsible. Collapsible merupakan suatu fungsi untuk menyembunyikan atau menampilkan konten yang bersifat informasi atau keterangan singkat pada suatu judul konten atau artikel. Dengan collapsible FAQ yang kita buat akan lebih interaktif. Untuk membuat collapsible kita hanya menambahkan <div> dengan data-role="collapsible". Silahkan anda buat struktur page jQuery Mobile seperti berikut :

Simpan kode diatas dengan nama collapsible.html. Kemudian buat script collapsible didalam elemen <div> main dengan cara membuat <div> seperti berikut :

<h3> mendefinisikan judul collapsible. Judul ini hanya dapat ditulis dari H1-H6. <p> merupakan isi konten yang disembunyikan atau ditampilkan. data-role="collapsibleset" mendefinisikan pembungkus atau group collapsible jika penulisannya lebih dari satu.

Simpan kembali file collapsible.html dan jalankan pada browser. Maka akan terlihat hasilnya sebagai berikut :

Terimakasih dan selamat mencoba.