Hallo teman-teman Dumet School, kembali lagi dengan saya di Shelli Ripati di Kursus Web Design. Kali ini saya akan membahas tentang cara Membuat Animasi Menu Menggunakan Fungsi Draggable Pada Jquery UI. Dimana nantinya saya akan membuat sebuah menu dengan menggunakan bootstrap dan kemudian menu tersebut dapat di pindah-pindahkan atau dapat di drag kemanapun yang kita mau.

Fungsi draggable pada jquery membantu kita memindahkan suatu objek atau elemen dari tempat asalnya ke tempat yang kita inginkan. Nah disini teman-teman bisa langsung membuat struktur htmlnya untuk dapat Membuat Animasi Menu Menggunakan Fungsi Draggable Pada Jquery UI. Dan berikut scriptnya ya teman-teman.

Teman-teman bisa perhatikan script di atas pada bagian head, disini saya menggunakan bootstrap versi 3 untuk untuk membuat tampilan menunya. Jika sudah selesai maka teman-teman bisa langsung membuat script jquery ui nya, sebelum itu teman-teman harus gunakan beberapa link jquerynya dan berikut linknya ya teman-teman. Teman-teman bisa salin dan letakkan di dalam tag head html.

Nah jika sudah selesai maka teman-teman bisa membuat script jquerynya untuk dapat Membuat Animasi Menu Menggunakan Fungsi Draggable Pada Jquery UI. Dan berikut scriptnya ya teman-teman, teman-teman bisa salin dan letakkan didalam head setelah link jquery yang sudah teman-teman salin sebelumnya.

Teman-teman bisa langsung simpan dengan format html dan jika teman-teman jalankan di browser masing-masing maka tampilan menunya akan seperti pada gambar di bawah ini. Dan menu ini bisa teman-teman drag untuk memindahkannya.

Membuat Animasi Menu Menggunakan Fungsi Draggable Pada Jquery UI

Demikian artikel tentang cara Membuat Animasi Menu Menggunakan Fungsi Draggable Pada Jquery UI. Semoga bisa bermanfaat dan selamat mencoba