دانلود jquery-ui و نشانی CDN ایرانی

jquery-ui یه کتابخانه جاوااسکریپت و CSS هست که روی jQuery سوار می شه و چند تا کار رابط کاربری رو آماده بهت می ده. چهار بخش اصلی داره. تعامل ها مثل draggable و droppable و sortable و resizable و selectable. ویجت ها مثل dialog و tabs و accordion و autocomplete و datepicker و slider و progressbar. افکت های انیمیشنی. و تم هایی که ظاهر ویجت ها رو تعیین می کنن. یعنی به جای اینکه برای هر کدوم از صفر کد بنویسی و روی مرورگرهای مختلف تستش کنی، یه چیز امتحان شده برمی داری و فقط تنظیمش می کنی.

بیشتر وقت ها وقتی سراغش می ری که یه صفحه تعاملی ساده می خوای. مثلاً فرم ثبت نامی که فیلد تاریخ داره، پنل مدیریتی که ردیف های جدولش باید با کشیدن جابه جا بشه، یا کادر جستجویی که موقع تایپ پیشنهاد می ده. توی وردپرس هم احتمالاً قبلاً باهاش سروکار داشتی. خود وردپرس بخشی از اسکریپت های jQuery UI رو همراه خودش داره و خیلی از قالب ها و افزونه ها ازشون استفاده می کنن. پس اگه می خوای به یه سایت قدیمی یه قابلیت اضافه کنی، این گزینه جواب می ده.

جاهایی هم هست که بهتره سراغش نری. اگه پروژه از اول با React یا Vue یا فریم ورک مشابه نوشته می شه، ویجت های خود همون اکوسیستم به کارت می آد. توسعه jQuery UI هم عملاً توی حالت نگهداریه، پس انتظار قابلیت جدید ازش نداشته باش. چند تا نکته دیگه هم هست. datepicker پیش فرض تقویم میلادی رو نشون می ده و برای تاریخ شمسی باید یه افزونه یا راه حل جدا بذاری. رفتار درگ و دراپ روی صفحه لمسی هم ممکنه اون چیزی نباشه که انتظار داری. روی موبایل حتماً تستش کن، چون بخش بزرگی از بازدیدکننده ها با موبایل وارد می شن.

موقع استفاده چند چیز رو یادت باشه. همه کتابخانه رو لازم نداری. می تونی فقط ماژول هایی رو که استفاده می کنی بسازی و حجم صفحه رو پایین نگه داری، که برای کاربر با اینترنت ضعیف خیلی مهمه. jQuery باید قبل از jquery-ui لود بشه و فایل CSS تم هم لازمه، وگرنه ویجت ها بدون ظاهر درست نشون داده می شن. اسم بعضی ویجت ها مثل button و tooltip ممکنه با کتابخانه های دیگه مثل بوت استرپ تداخل پیدا کنه. اگه رفتار عجیبی دیدی، اول ترتیب لود رو چک کن.

نسخه های رسمی و بدون تغییر jquery-ui توی مخزن داخلی ما هم هست. وقتی دسترسی به منابع خارجی قطع یا کند باشه، می تونی از همین جا برداری.

راهنمای استفاده

برای استفاده از jquery-ui روی یه سایت معمولی، قدم ها ساده هستن. اول مطمئن شو خود jQuery توی صفحه هست، چون jquery-ui بدون اون کار نمی کنه.

• فایل های کتابخانه رو از همین صفحه دانلود کن و روی هاستت، مثلاً توی پوشه اسکریپت ها و استایل های سایت، بذار.
• فایل CSS تم رو توی بخش head صفحه صدا بزن.
• فایل جاوااسکریپت jquery-ui رو بعد از jQuery و قبل از کدهای خودت لود کن. کد آماده این بخش پایین همین صفحه هست و می تونی کپیش کنی.
• بعدش توی کد خودت ویجت رو روی یه عنصر صدا بزن. مثلاً برای تب ها، ویجت tabs رو روی کانتینرش اجرا می کنی و گزینه ها رو بهش می دی.

اگه سایتت وردپرسیه، لازم نیست حتماً فایل جدا اضافه کنی. وردپرس چند تا از اسکریپت های jQuery UI رو خودش ثبت کرده. با تابع wp_enqueue_script و اسم هایی مثل jquery-ui-datepicker یا jquery-ui-sortable می تونی صداشون بزنی. فقط وقتی نسخه جدا لازمه که نسخه همراه وردپرس کافی نباشه.

آخرش سایت رو روی چند مرورگر و حتماً روی موبایل باز کن و کنسول مرورگر رو نگاه کن. اگه خطای تعریف نشدن jQuery دیدی، تقریباً همیشه ترتیب لود اسکریپت ها مشکل داره.