Swapy
JavaScript tool to convert any layout to a drag-to-swap one
تحويل أي تصميم إلى تصميم قابل للسحب والتبديل بسهولة مع Swapy، أداة مستقلة عن الإطار يمكنك استخدامها في بضع سطور من الكود.
المزيد عن Swapy
Swapy
Swapy أداة JavaScript بسيطة لتحويل أي تصميم إلى تصميم قابل للسحب والإفلات. تُسهّل هذه الأداة عملية إنشاء واجهات تفاعلية سهلة الاستخدام. تُناسب Swapy المواقع الإلكترونية والتطبيقات التي تتطلب واجهات قابلة للتخصيص.
- •تحديد الأماكن والعناصر:تسمح Swapy للمستخدم بتحديد أماكن (Slots) لعناصر قابلة للسحب والإفلات (Items) من خلال إضافة سمات بيانات بسيطة إلى عناصر HTML الخاصة به. كل مكان يمكن أن يحتوي على عنصر واحد فقط. يُمكن للمستخدم تحديد أي عنصر كعنصر قابل للسحب والإفلات.
- •تحديد مقابض السحب:توفر Swapy خيار تحديد مقابض (Handles) لعناصر قابلة للسحب والإفلات، مما يُسهّل عملية السحب والإفلات، وخاصةً في التصاميم المعقدة. يُمكن إضافة عنصر منفصل يعمل كمقبض للسحب. هذا يُعزز من تجربة المستخدم ويُحسّن من سهولة الاستخدام.
- •تخصيص المظهر البصري:تتيح Swapy للمستخدم تخصيص مظهر المكان المحدد حاليًا من خلال تعديل أنماط CSS. يُمكن للمستخدم إضافة أنماط مخصصة لعنصر `[data-swapy-highlighted]` لتوفير تجربة بصرية مُحسّنة. هذا يُمكّن المستخدم من التحكم الكامل في المظهر البصري للتفاعل.
- •أنواع الرسوم المتحركة:تدعم Swapy ثلاثة أنواع من الرسوم المتحركة: ديناميكية، ومرنة، ولا شيء. يُمكن للمستخدم اختيار نوع الرسوم المتحركة المناسب لتصميمه وتفضيلاته. هذا يُعطي المستخدم المزيد من التحكم في تجربة المستخدم.
- •تمكين وإبطال الوظيفة:تُتيح Swapy تمكين وإبطال وظائفها في أي وقت، مما يُعطي المستخدم تحكمًا كاملاً في عملية السحب والإفلات. يُمكن للمستخدم التحكم في تشغيل وإيقاف وظيفة Swapy حسب الحاجة. هذا يُحسّن من مرونة الاستخدام.
تُسهّل Swapy عملية تحويل أي تصميم لديك إلى تصميم قابل للسحب والإفلات، مما يُحسّن من تجربة المستخدم ويسرّع من عملية التطوير. بفضل بساطتها ومرونتها، ستتمكن من إنشاء واجهات تفاعلية غنية بالخصائص دون الحاجة إلى الكثير من الجهد. اختر Swapy لتوفير الوقت والجهد، وركز على الابتكار.
