Draggable: کتبخانه‌ای سبک، ریسپانسیو و مدرن برای درگ & دراپ

Draggable: کتبخانه‌ای سبک، ریسپانسیو و مدرن برای درگ & دراپ

Draggable یک لایبرری درگ & دراپ (کشیدن و رها کردن) ماژولار است که به شما اجازه می‌دهد تا از یک طراحی کوچک و مینیمالیستی شروع کرده و بر اساس نیاز و ویژگی‌هایی که مد نظر دارید، آن را بست و گسترش دهید. در کامل‌ترین حالت استفاده از این لایبرری، شما امکان درگ و دراپ کردن، مرتب‌سازی سریع DOM،‌ نشانه‌گذاری و مارکاپ‌های قابل دسترسی و مجموعه‌ای از فیچرهای دیگر را خواهید داشت که در ادامه بیشتر در مورد آنها بحث خواهیم کرد (DOM مخفف عبارت Document Object Model است که به منزلهٔ یک API است بیشتر در زبان‌های HTML و XML برای مرتب‌سازی و نظم دادن به اینترفیس‌ها به‌ کار می‌رود).

قابلیت سوآپ کردن
با ویژگی Swap شما می‌توانید یک عنصر یا شیٔ را بکشید و روی دیگری رها کنید و مشاهده کنید که مکان آنها با یکدیگر عوض شده است و در عین حال وضعیت DOM نیز حفظ شده است. به عبارتی، بعد از جابجایی اشیاء، نظم و ترتیب عناصر دیگر به‌هم نمی‌ریزد. این عملکردی ایده‌آل است برای زمانی که حالت اشیاء و عناصر باید حفظ شود.

قابلیت سُورت کردن
شما می‌توانید دسته‌های مختلف را با یک استایل خاص Sort کنید. یک آیتم از یک دسته را به نقطه‌ای دیگر بکشید و آنگاه خواهید دید که همه چیز درست و مرتب می‌ماند و استایل و سبک عناصر تغییری نخواهد کرد. یک مرتب‌سازی سریع و ریسپانسیو که هرگز پرفورمنس رابط کاربری شما را تحت تأثیر قرار نخواهد داد.

قابلیت تشخیص برخورد عناصر
مانند حرفه‌ای‌ها عمل کنید و برخوردهای نامطلوب را تشخیص دهید. این حالت از هم‌پوشانی عناصر نسبت به یکدیگر و کشیدن و جابجایی عناصر خارج از محدودۀ تعیین شده، جلوگیری می‌کند (این فیچر به درد زمان‌هایی می‌خورد که قصد داریم جلوی اشتباهات احتمالی کاربران را بگیریم).

بهبود عملکرد مرورگرها
عملکرد درگ & دراپ ظرافت خیلی خاصی دارد؛ در حالی که مرورگرها روی یک راه‌حل قابل اعتماد و در عین حال ساده کار می‌کنند، این لایبرری به دسترسی به تمام ویژگی‌های مناسب هر مکان خاص کمک می‌کند.

قابلیت گسترش دادن
گسترش دادن و بست لایبرری Draggable‌ بسیار آسان است (شما می‌توانید ماژولی را که به آن نیاز دارید بنویسید و به صفحهٔ گیت‌هاب Draggable‌ ارسال کنید تا مورد بررسی قرار گیرد). اگر شما به ماژولی نیاز دارید و در عین حال هنوز طراحی نشده است، به شانس شما برمی‌گردد که آیا جامعهٔ دولوپرهای فرانت‌اند به آن نیاز خواهد داشت یا نه تا برای طراحی بررسی شود.

قابلیت تعاملی بودن
این لایبرری از بسیاری از اتفاقات، عمل و عکس‌العمل‌هایی که می‌توانیم فکرش را بکنیم پشتیبانی می‌کند که از آن جمله می‌توان به کلیک ماوس، لمس کردن و فورس تاچ (فشار دادن و لمس کردن صفحه و تشخیص نیروی وارد شده هنگام لمس از طرف سیستم) در این پکیج در دسترس هستند. لازم به ذکر است که عملکرد دکمه‌های کیبورد هم به زودی پشتیبانی می‌شوند.

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

منبع


علی‌اکبر محمدی