Video: Membuat Menu Bisa di Drag Dengan jQuery 2024
Menulis kod UI jQuery tidak sukar, tetapi mendapatkan bahagian kanan perpustakaan boleh menjadi sedikit mengelirukan untuk pemrogram HTML5 dan CSS3. Perpustakaan jQuery UI jauh lebih besar daripada pakej jQuery standard, jadi anda mungkin tidak mahu memasukkan keseluruhan perkara jika anda tidak memerlukannya.
Versi sebelum UI jQuery membenarkan anda memuat turun keseluruhan pakej tetapi menyimpan setiap elemen dalam fail JavaScript berasingan. Ia adalah perkara biasa untuk mempunyai setengah lusin tag skrip berbeza yang aktif hanya untuk mendapatkan pelbagai elemen di tempat.
Lebih buruk lagi, terdapat beberapa isu ketergantungan, jadi anda perlu pastikan pakej tertentu terpasang sebelum anda menggunakan pakej lain. Ini menjadikan perpustakaan mudah agak rumit untuk digunakan sepenuhnya.
Nasib baik, versi terbaru jQuery UI membuat proses ini agak mudah:
-
Pilih (atau buat) tema anda.
Gunakan laman temaRoller untuk memilih tempat permulaan dari pustaka template. Anda kemudian boleh menyesuaikan tema anda dengan tepat untuk membuat apa sahaja yang anda mahu (menukar warna, fon, dan elemen lain).
-
Muat turun tema.
TemaRoller mempunyai butang muat turun. Klik ini apabila anda sudah bersedia untuk memuat turun tema anda.
-
Pilih elemen yang anda mahu.
Apabila anda mula-mula memulakan projek, anda mungkin akan memilih semua elemen. Sekiranya anda mendapati halaman tersebut memuat terlalu perlahan, anda mungkin membina versi yang lebih kecil yang mengandungi hanya unsur-unsur yang anda perlukan. Buat masa ini, pilih segalanya.
-
Muat turun fail.
Selepas anda memilih elemen yang anda mahu, anda boleh memuat turunnya dalam fail zip.
-
Memasang kandungan fail zip ke direktori kerja anda.
Fail zip mengandungi beberapa fail dan direktori. Salin direktori css dan js ke dalam direktori di mana halaman web anda akan menjadi (sering direktori public_html atau htdocs). Anda tidak perlu menyalin direktori pakej pembangunan atau indeks. halaman html.
-
Jika anda memasang pelbagai tema, salin hanya maklumat tema daripada tema tambahan.
Semua tema menggunakan JavaScript yang sama. Hanya CSS (dan fail imej yang berkaitan) berubah. Sekiranya anda ingin mempunyai banyak tema dalam projek anda, silakan salin kandungan CSS. Setiap tema akan menjadi subdirektori yang berbeza dari direktori CSS utama.
-
Pautan ke fail CSS.
Gunakan teknik pautan standard untuk memaut ke fail CSS yang dibuat oleh jQuery UI. Anda juga boleh memautkan ke fail CSS anda sendiri atau menggunakan CSS dalaman sebagai tambahan kepada CSS khusus. Pastikan anda mendapat laluan yang betul.
-
Pautan ke fail JavaScript.
The jQuery UI toolkit juga memasang dua fail JavaScript: perpustakaan jQuery standard dan perpustakaan jQuery UI. Secara lalai, kedua-dua fail ini dipasang dalam direktori js. Anda perlu memaut ke kedua-dua fail. Kadang-kadang anda akan melihat diminimalkan fail bersebelahan dengan versi biasa. Versi yang diminimumkan akan mempunyai istilah min tertanam. Sama ada versi adalah baik, tetapi versi yang diminimumkan akan memuatkan lebih cepat.
Jika sesuatu tidak berfungsi dengan baik, periksa laluan fail anda sekali lagi. Hampir selalu, masalah timbul kerana anda tidak dihubungkan ke semua fail yang betul. Juga, perhatikan bahawa fail CSS yang dibuat oleh jQuery UI juga termasuk imej. Pastikan tema anda mempunyai direktori imej yang berkaitan, atau projek anda mungkin tidak berfungsi dengan betul. Sekiranya anda menyalin keseluruhan CSS dan direktori JS dari muat turun, anda harus baik-baik saja.
