Skip to content →

Membuat Game Puzzle dengan jQuery UI Sortable

Itung2 buat refresing  yang kebetulan di salah satu modul dalam project yg sedang tak kerjakan saat ini mengunakan jquery sortable. Nah ternyata bisa juga digunakan untuk membuat Game puzzle dengan menambah sedikit script tambahan. Karna cm buat refresing, ya game nya yg simpel aj. Lihat Demo

Pertama siapkan gambar berbentuk persegi, lalu di potong2 menjadi 9 bagian yg seukuran. Setelah itu baru mulai coding nya. Caranya seperti biasa, includkan beberapa library yg dibutuhkan.

Lalu buat sortable nya

Kemudian tambahkan script untuk menyimpan posisi urutan item2 nya.

Bikin wadah/bingkai dengan <div></div> dengan ukuran menyesuaikan dengan gambar. Kemudian bagian utamanya berupa elemen <ul></ul> yg di dalamnya terdapat item2 yg dapat di drag, sort.

Selesai dah, kalau mau lihat hasilnya di sini ni

Published in Coding Dunia IT JavaScript - Jquery

4 Comments

  1. Hello Dear, are you actually visiting this website regularly, if so then you
    will without doubt get nice knowledge.

  2. Hiya! I simply would like to give an enormous thumbs up
    for the great info you’ve here on this post. I can be coming
    again to your weblog for extra soon.

  3. As a Newbie, I am continuously browsing online for articles that can help me. Thank you

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.