Awesome GitHub Repositories3D Transform Animations

Magic of CSS is a structured tutorial series that teaches web developers advanced CSS layout, typography, and animation techniques through hands-on examples. The course covers the full spectrum of CSS capabilities, from foundational box model and positioning concepts to sophisticated animation and interactive state management, all without relying on JavaScript. The series distinguishes itself by teaching practical, real-world CSS patterns such as inline-block justified grids, percentage-based absolute positioning, table-display vertical centering, and letter-span styling techniques. It demons

bounce.js هي مكتبة JavaScript وغلاف برمجي لتوليد وتطبيق رسوم متحركة CSS3 وتحويلات ثلاثية الأبعاد. توفر أداة لإنشاء تسلسلات رسوم متحركة معقدة دون الحاجة إلى كتابة قواعد ورقة أنماط يدوية. تسمح المكتبة بإنشاء رسوم متحركة عن طريق ربط تحويلات القياس، والدوران، والإزاحة، والميل. يمكن حفظ هذه التسلسلات المولدة تحت أسماء فريدة لإعادة استخدامها عبر عناصر متعددة. يدير النظام دورة حياة الرسوم المتحركة من خلال وظائف رد الاتصال (callback) التي يتم تشغيلها عند اكتمال تسلسل مرئي. كما يتضمن مدقق توافق للتحقق مما إذا كانت بيئة المتصفح تدعم التحويلات ثلاثية الأبعاد ومواصفات الإطارات الرئيسية المطلوبة.

snabbt.js هو إطار عمل حركة JavaScript ومكتبة رسوم متحركة لتحويل CSS تُستخدم لإنشاء رسوم متحركة عالية الأداء لعناصر DOM. يعمل كمحرك رسوم متحركة CSS ثلاثي الأبعاد ومجموعة أدوات هندسية قائمة على المصفوفات لحساب الترجمات والدورانات والمقاييس والانحرافات الدقيقة. يوفر إطار العمل وحدة تحكم في الرسوم المتحركة يحركها المستخدم تسمح بربط تقدم الرسوم المتحركة بمدخلات المستخدم اليدوية بدلاً من التشغيل القياسي القائم على الوقت. يتيح محاكاة العمق والمنظور عن طريق تحريك عناصر HTML إلى أشكال ثلاثية الأبعاد. يغطي النظام تنسيق الحركة من خلال تسلسل الرسوم المتحركة ومعالجة العناصر المجمعة. يتضمن قدرات للتخفيف القائم على الفيزياء، ورسوم متحركة للنصوص على مستوى الحرف، وتكوين أصول التحويل لمعالجة هندسة العناصر.

هذا المشروع عبارة عن مجموعة من نماذج التنفيذ والمكونات التجريبية لواجهة المستخدم. يعمل كمعرض للأمثلة التي توضح الرسوم المتحركة المتقدمة، وعرض الرسومات المخصصة، وتقنيات التفاعل غير القياسية. يوفر المستودع عروضاً توضيحية للحركة عالية الدقة، بما في ذلك التحويلات ثلاثية الأبعاد، ورسوم تسلسل الصور المتحركة، وانتقالات الصفحات الانسيابية. يتضمن مكتبة لتجارب الرسومات التي تستخدم الرسم على Canvas ومسارات المتجهات لعرض أنظمة الجسيمات وتصورات البيانات. يغطي سطح التنفيذ مجموعة من قدرات واجهة المستخدم المتقدمة، مثل عرض الكائنات ثلاثية الأبعاد الغامرة ومكونات التنقل التفاعلية. كما يتضمن أنماطاً لإدارة النماذج المعقدة متعددة الأجزاء مع التحقق الديناميكي وأدوات تصور البيانات التفاعلية لعرض المخططات والرسوم البيانية.

stroll.js هي مكتبة رسوم متحركة لواجهة المستخدم الأمامية مصممة لتحويل قوائم الويب القياسية إلى شاشات تمرير ثلاثية الأبعاد. تعمل كأداة لإنشاء منظورات قائمة على العمق باستخدام تحويلات CSS3. تتخصص المكتبة في رسوم متحركة الويب ثلاثية الأبعاد وتصميم القوائم التفاعلية. تنفذ تأثيرات مرئية تستجيب لحركة المستخدم، مما يضيف عمقاً مكانياً ومنظوراً لعناصر القائمة أثناء التنقل فيها.

vanilla-tilt.js is a JavaScript 3D tilt library used to animate web elements in 3D space. It functions as an interactive UI animation tool that drives element rotation and scale effects based on mouse movement or mobile device orientation. The library distinguishes itself through the simulation of physical surfaces, utilizing a dynamic light glare effect to create glossy reflections that shift with the cursor. It also includes a parallax depth system that offsets inner elements relative to a parent container to simulate physical layering and three-dimensional space. The toolkit covers a broa