75 أدوات الرسوم المتحركة على الإنترنت لديك لمحاولة
الرسوم المتحركة هي واحدة من تلك الاتجاهات التي حصلت على مخالبها في واجهات الويب. تتقلب شعبيتها ، ولكنها موجودة دائمًا في مكان ما ، كمكون أساسي في أي موقع ويب.
من زنابير صغيرة ، بالكاد مرئية ومرئية ، إلى انتقالات الصفحة بأكملها مثل تجربة الأفلام ، الرسوم المتحركة تصل إلى كل منطقة من التصاميم لدينا.
للمصممين الذين يتطلعون إلى دمج الرسوم المتحركة ، هناك ثروة من الخيارات المتاحة. من التحولات الزخرفية البحتة التي تقوم فقط بتجميل الواجهات ، إلى تأثيرات ذات معنى والتي تعزز خبرات المستخدم ، فإن مجموعتنا تغطي الأدوات التي تسمح لك بصناعة الرسوم المتحركة لمختلف المقاييس ولأغراض مختلفة. إليك 75 مكونًا إضافيًا ومكتبات ستحتاج إلى التحقق منها. لن تستخدمها في كل مرة ، لكن لكل منها حالة استخدام مثالية ، وبعضها سوف تستخدم مرارًا وتكرارًا ...
1. Animate.css
Animate.css هي مكتبة أساسية من الرسوم المتحركة عبر المتصفح الأنيق التي تكمن وراء العديد من الحلول. بدءًا من عمليات الإمساك الكلاسيكية والإبهام إلى التقلبات الحديثة والآثار الفريدة ، فهي قادرة على تلبية احتياجات أي مشروع تقريبًا.
2. سحر الرسوم المتحركة
الرسوم المتحركة السحرية يركز على التأثيرات الاستثنائية التي تمنح الواجهة مظهرًا مميزًا. على الرغم من أن المكتبة لا يمكنها التباهي بالتنوع الهائل ، إلا أنها تكفي لإثراء تجربة المستخدم.
3. Bounce.js
Bounce.js هو ملعب صغير حيث يمكنك إجراء تجارب باستخدام الرسوم المتحركة المستندة إلى CSS. ما عليك سوى إضافة أحد المكونات وتوليف الإعدادات ليتمكّن كل شيء من العيش. وفي النهاية ، قم بتصدير ملف css.
4. AnijS
AnijS يساعد في التعامل مع الرسوم المتحركة بطريقة بديهية باستخدام تعليمات بسيطة مثل If، On، Do، To. والشيء العظيم هو أنك مرحب بك لاستخدام الفصول الدراسية الخاصة بك أو حتى Animate.css (المذكورة سابقاً) لإنشاء شيء رائع.
5. Snabbt.js
Snabbt.js تشتهر بنهجها الحد الأدنى الذي يجلب الرسوم المتحركة بسرعة. يزن فقط 5 كيلو بايت. ومع ذلك ، فهي قادرة على إعطاء أي عنصر دفعة واضحة عن طريق الترجمة ، الدورية ، التخطي ، التدريج أو تغيير حجم شكله.
6. Kute.js
Kute.js هو محرك الرسوم المتحركة الذي يقدم أداء ممتاز. فهو سريع ومتوافق عبر متصفحات مختلفة بفضل مجموعة من النسخ الاحتياطية القابلة للتطبيق والتي تتعامل مع المتصفحات القديمة. يأتي مع العديد من الإضافات لتوفير بيئة عمل فعالة.
7. Velocity.js
Velocity.js هو محرك للرسوم المتحركة قد يبدو للوهلة الأولى غير تمثيلي. ومع ذلك ، تشتمل ترسانته على جميع الأنواع المنتظمة من الرسوم المتحركة مثل التحوير ، والتكرار ، والتخفيف ، والتمرير ، إلخ. وهي سريعة ومستقلة.
8. رسام خط كسول
أصبحت مسارات SVG المتحركة سهلة مع كسول خط الرسام . التقط صورتك الفنية من Illustrator بتنسيق SVG وقم بتحميلها إلى المحول. سيقوم الأخير بإنشاء ملف jQuery يتعامل مع عملية الرسوم المتحركة. إذا لزم الأمر ، يمكنك إجراء تغييرات داخل الرمز مباشرةً.
9. SVG.js
SVG.js يقدم لك بيئة سهلة الاستخدام يمكنك من خلالها تحريك وتحريك ملفات SVG. انها صغيرة ومستقلة مع بناء جملة نظيفة و API موحدة. افعل ما تريد: حجم متحرك ، ولون ، وموضع ، ومسارات نصية ؛ مكونات تحويل ربط الأحداث وما إلى ذلك.
10. حركة واجهة المستخدم
على عكس الأمثلة السابقة ، Motion UI يستفيد من SASS لإنشاء الرسوم المتحركة CSS للفضول. هناك مجموعة كاملة من التحولات والآثار المحددة مسبقًا التي يمكن تطبيقها على أي مكون HTML. كل شيء يعمل في جميع المتصفحات الشعبية باستثناء IE9.
11. انتظر! حي
انتظر! حي يتيح لك تشغيل التأخير وينتظر في الرسوم المتحركة بطريقة بسيطة. حساب جميع الفترات الزمنية المطلوبة من خلال لوحة صغيرة وبناء الرسوم المتحركة الطبيعية دون صخب وصخب.
12. Dynamics.js
Dynamics.js هي مكتبة تعمل بنظام جافا سكريبت والتي توفر 9 تأثيرات قياسية للعب بها. يمكنك تحديد المدة ، والتكرار ، والاحتكاك ، وحجم الترقب ، وقوة التوقع لتحقيق رسوم متحركة واقعية تستند إلى الفيزياء.
13. Choreographer.js
مع Choreographer.js في متناول يديك ، يجب ألا تكون خائفًا من الرسوم المتحركة المعقدة ، حيث تعمل مكتبة جافا سكريبت هذه على كل الرفع الثقيل. على الرغم من أنه يتعامل مع كمية محدودة من الرسوم المتحركة إلا أنه يتيح لك العمل مع وظائف مخصصة بحيث يمكنك صنع روائع خاصة بك.
14. Anime.js
يأتي مع مجموعة رائعة من الميزات التي تسمح بتسلسل رسوم متحركة متعددة ، وتزامن مختلف الحالات ، وخطوط الرسم ، وتحوير الأشياء ، وبناء الرسوم المتحركة الفردية وغيرها ، وهذا محرك الرسوم المتحركة جافا سكريبت سوف يفاجئك بقدراته.
15. Mo.js.
Mo.js لتقف على الحركة للويب. إنه سريع بشكل لا يصدق وفي نفس الوقت بسيط وبسيط. يمكنك إنشاء مسارات جذابة ، وتحولات مشروطة في حوارات غير متوقعة ، وتخطيطات فقاعية ، وفرض رسوم متحركة أكثر من ذلك بكثير.
16. Sequence.js
Sequence.js هو إطار يعتمد على CSS لإنشاء رسوم متحركة مستندة إلى اللمس مستجيبًا. وهو مثالي لإنشاء أشرطة التمرير والعروض التقديمية واللافتات وأنواع أخرى من المكونات الديناميكية. من بين العديد من الخطط المتميزة ، ستجد واحدة مجانية تمنحك رخصة شخصية مفتوحة المصدر.
17. زيفتي
داهية هو محرك tweening مع التركيز القوي على التحسين والأداء السريع والمرونة والقابلية للتوسعة. وهو يعتبر بديلاً قابلاً للتطبيق لـ GreenSock حتى الآن مع واجهة أكثر بساطة.
18. إنه يوم الثلاثاء
الثلاثاء هي مكتبة رسوم متحركة مستقلة يمكن استخدامها جنبًا إلى جنب مع المكتبات الأخرى. يجعل المداخل والخروج تبدو ناعمة ودقيقة وأنيقة. يقدم مجموعة متنوعة من التأثيرات القياسية مثل التضمينات والتوسعات والتقلصات والمغذيات وما إلى ذلك.
19. CSS المغلق
CSS تحريك هو ملعب بدائي يولد رمزًا صالحًا وخاليًا من الفوضى لأي رسوم متحركة عادية. تعيين الاسم ، والفئة ، وخصائص الحركة ، وخصائص الإطار ؛ التعامل مع المخطط الزمني وإضافة علامات: في كلمة واحدة ، اضبط كل شيء تحتاج إليه لإنشاء رسم متحرك منتظم يستند إلى الإطارات الأساسية.
20. Vivus.js
الشحن مع ثلاثة أنواع من الرسوم المتحركة: التأخير والمزامنة والكشف عن واحد تلو الآخر ، Vivus.js سوف يرسم SVG بطريقة ناعمة وطبيعية مما يجعل ظهور المكون تجربة جميلة. يمكنك الانتقال إلى الرسوم المتحركة المحددة مسبقًا أو استخدام وظائفك المخصصة.
21. Bonsai.js
Bonsai.js هي مكتبة جافا سكريبت لمعالجة الصور المتطورة. يحتوي على واجهة برمجة تطبيقات بسيطة جدًا وعارض SVG. استخدم محررها على الإنترنت لإعطاء تجربة قيادة ، تعرّف على التركيب اللغوي ، وقم بتنزيل بعض العينات للبدء.
22. GSAP by GreenSock
GSAP هي عبارة عن نظام أساسي قوي للرسوم المتحركة يستهدف الرسوم المتحركة الاحترافية. لديها العديد من الإضافات والأدوات المساعدة المسؤولة عن أنواع مختلفة من الرسوم المتحركة. وتتكون من BezierPlugin و CSSPlugin و DrawSVGPlugin و MorphSVGPlugin و Physics2DPlugin و TweenLite وغيرها.
23. Popmotion
Popmotion هو بديل آخر خفيف الوزن ومفيد ل Greensock في مجموعتنا. هو محرك الحركة مع السيطرة الكاملة على كل إطار. لديها متطورة لون ، مزج اللون وحفنة من وظائف وإجراءات لبناء حلول معقدة.
24. Tween.js
يتم إجراء قدر كبير من الأشياء المدهشة بمساعدة Tween.js . إنه محرك متين متطور مع العديد من المعلمات للحصول على صورة متحركة تحت السيطرة. وهو أيضًا حل ممتاز لتعزيز المشاريع التي يقودها Three.js.
25. Hover.css
Hover.css يمكن تقسيم المكتبة إلى عدة فئات أساسية: التحولات ثنائية الأبعاد ، التحولات في الخلفية ، الرسوم المتحركة للأيقونات ، التحولات الحدودية ، التحولات في الظل والوهج ، فقاعات الكلام والضفائر. تطبيق هذه التأثيرات على أي عنصر في التصميم الخاص بك دون قيود.
26 - النقل
قائمة ميزات عبور هي قصيرة إلى حد ما ، لكنها تتضمن أكثر الأشياء حيوية لبناء تحولات ثنائية وثلاثية الأبعاد. على سبيل المثال ، يمكنك تحديد التأخير والمدد ، وإضافة وظيفة التيسير ، واستخدام القيم النسبية ، وأكثر من ذلك.
27. صاروخ
صاروخ هو حل لإضفاء طابع مسبق على حركة الكائن من نقطة إلى أخرى. هناك 8 مؤثرات خاصة مثل النبض أو الدوران التي تعطي هذه الرحلة متعة رائعة .
28. Animo.js
Animo.js هي أداة صغيرة نسبياً للحصول على مؤشر على التحولات والرسوم المتحركة. يحتوي على مجموعة من الإضافات الإضافية مثل العد التنازلي والتدوير والحركة التي تثري المكتبة وتسهل تحقيق التأثير المطلوب.
29. Shift.css
Shift.css هو إطار لإنشاء رسوم متحركة داخل حاوية تؤثر على كل من العناصر المتداخلة والمتكيفة. هناك 15 نوعًا من الرسوم المتحركة القياسية ، بما في ذلك التنقل والدخول والخروج والإلقاء وبعض الأنواع الأخرى.
30. اسكيشكي
CSShake يأتي مع 11 فئة تجبر عناصر DOM على الهز. يمكنك اختيار اتجاه (أفقي أو رأسي) ، اكتب (ثابت ، مجنون ، ثابت ، قطعة) ، شدة (بطيئة أو صلبة) أو مجرد الذهاب للخيار الافتراضي.
31. الزعفران
إذا كنت تفضل استخدام mixins من أجل التلاعب بسرعة وسهولة الرسوم المتحركة والتحولات زعفران هو بالتأكيد بالنسبة لك. هو عبارة عن مجموعة من الأساليب القابلة لإعادة الاستخدام التي تتم كتابتها في Sass حيث يمكنك تعيين المتغيرات والمعلمات.
32. CSSynth
CSSynth هو محرر صغير حيث يمكنك التمتع بجمال التزامن. يعتمد الرسم المتحرك على مجموعة من المربعات التي يمكنك تحديد عدد منها على اللوحة اليمنى. حدد تأثيرًا ، واضبط التأخير واختر ما إذا كنت تريد تنزيل شفرة النتيجة بتنسيق CSS أو SCSS.
33. سيزر
سيزر أداة قديمة أثبتت جدواها لإجراء تجارب مع الرسوم المتحركة التقليدية للتخفيف. هناك عدد من المتغيرات تبدأ من خطي وتنتهي مع واحد مخصص. معلمتان إضافيتان (المدة والتأثير) ستساعدان في تحسين النتيجة.
34. مورف
لاتخاذ الأداة المذكورة أعلاه أبعد قليلا ، يمكنك محاولة ل Morf.js . ويقدم التحولات على أساس وظائف التخفيف المخصصة. هناك ما يقرب من 40 خيارًا معرّفة مسبقًا يمكنك تعديلها بسرعة إلى مشروعك.
35. Voxel.css
Voxel.css تم إنشاؤه خصيصا لالأداءات 3D. يسمح تطبيقه البسيط للمبتدئين بالحصول على فهم CSS ثلاثي الأبعاد. تضم المكتبة 4 صفوف مهمة: Scene و World و Editor و Voxel التي تساعد على بناء الألعاب والاستمتاع بالحدث.
36. Repaintless.css
Repaintless.css يستخدم تقنية FLIP لجعل الرسوم المتحركة سريعة وسلسة. على الرغم من أنها تتطلب بعض التحسينات ؛ ومع ذلك ، فهي بداية مثالية لأولئك الذين يولون اهتماما خاصا بالأداء.
37. MixItUp
MixItUp هي مكتبة لتجميل التصفية والفرز والإدراج وغير ذلك من الإجراءات الافتراضية المتأصلة في واجهات الأغلبية مثل الحافظات والمعارض وما إلى ذلك. وهي خالية من التبعية وتعهد بتوفير مستوى عالٍ من الأداء.
38. والوب
كما ينص العنوان ، لكمة هو لإظهار وإخفاء الأشياء بطريقة ممتعة ؛ على نحو متوقع ، فإن استخدامها العام يكمن في بناء منزلقات. ومع ذلك ، لا أحد يمنعك من استغلال إمكاناتها وخلق شيء مثير للاهتمام ومثير للاهتمام.
39. رامجيت
المحرك النفاث يحول عنصر واحد إلى آخر مع وهم الحركة التي تتحقق عن طريق وظيفة تخفيف. إنها قادرة على العمل مع عناصر DOM ، أو SVGs ، أو الصور الثابتة أو الصور المتحركة.
40. jQuery DrawSVG
استنادًا إلى محرك قوي من jQuery animation ، فإنه يعمل بكفاءة على جذب جميع المسارات داخل SVG مما يعطي الصورة دراماتيكية وفي نفس الوقت مدخلًا أنيقًا. الإجراء بسيط: إضافة البرنامج المساعد إلى الصفحة وتهيئتها وتشغيل الرسم المتحرك.
41. Animatic.js
Animatic.js هو حل متميز عبر المستعرض مع قواعد فيزيائية مدمجة تستخدم تحويلات CSS وتحويلات ثلاثية الأبعاد وجافا سكريبت لإضفاء الحيوية على كل شيء. وتتمثل مهمتها الرئيسية في تقليل جهودك لتحريك العديد من الأشياء دفعة واحدة. يمكنك إنشاء صور متحركة متوازية ومتتابعة مع ضبط المدة والتأخير والتخفيف.
42. Move.js
Move.js هي أداة مبسطة لإنشاء رسوم متحركة منتظمة مثل التدرج أو التخييط أو الانتقال أو الترجمة. يمكن تحسين كل الرسوم المتحركة مع وظيفة سهولة الكلاسيكية.
43. Eg.js
Eg.js هي مجموعة مجمعة بعناية من تأثيرات مختلفة وعناصر ديناميكية تهدف إلى تعزيز التفاعلات في الواجهات. هناك 8 مكونات قوية تقوم بفرز المهام الأساسية و 6 طرق وفعاليات رئيسية لأغراض أخرى.
44. GFX
GFX هي مكتبة رسوم متحركة ثلاثية الأبعاد لبناء الرسوم المتحركة CSS3 بطريقة برمجية. يعمل مع jQuery مما يجعل الأمر أسهل بكثير لإنتاج النتيجة المرجوة. يمكنك اللعب مع التحجيم ، والتناوب ، والترجمة ، والتخطي ، وبعض الأشياء الأخرى.
45
على الرغم من أن يقال ذلك Stylie هي أداة للتسلية ، لكنها بالتأكيد ستثير إعجابك بقدراتها. يتميز مركز التحكم ب 4 علامات تبويب تسمح لك بتوليف الإطارات المفتاحية ، والتخفيف ، وخيارات التصدير ، و HTML ، مما يجعل الرسوم المتحركة المعقدة سهلة الحمل.
46. Iconate.js
Iconate.js يضخ الحياة في تحولات الرموز ، مما يعزز الانتقال بين عنصرين من خلال تأثير مصاحب لطيف. إنه يعمل بشكل رائع ليس فقط مع Font Awesome ، ولكن أيضًا مع Glyphicons وحتى مجموعة الصور التوضيحية المخصصة الخاصة بك.
47. AnimateMate
AnimateMate هي أداة صغيرة لإنتاج صور متحركة صغيرة الحجم وتصديرها من بيئة Sketch الخاصة بك. إنه ليس شيئًا رائعًا ، ولكنه يسمح لك باللعب باستخدام الإطارات الرئيسية ، وإضافة وظائف التيسير ، ومتابعة التسلسلات وغيرها.
48. CAAT
CAAT (والتي تعني مجموعة أدوات الرسوم المتحركة المتقدمة من Canvas) عبارة عن إطار عمل استيرالي يشكل ترادفًا قويًا مع جافا سكريبت. تتميز مجموعة أدواتها بالمشاهد ، وتقنيات التجميع المتعدد ، وأقنعة القطع ، ومجموعة قياسية من السلوكيات ، إلخ.
49. Granim.js
Granim.js هي مكتبة جافا سكريبت صغيرة الحجم لتدفق الواجهات مع القطع المركزية التفاعلية المتدرجة. يمكن أن يكون رسمًا متحركًا تدرجًا قياسيًا تدريجيًا ، أو تدرجات ديناميكية مطبقة فوق صورة الخلفية ، أو تدرجات متحركة مقترنة بأقنعة الصورة.
50. Animista
تم الإنشاء بواسطة Ana Travas ، Animista هو ملعب لإجراء تجارب باستخدام مجموعة من الرسوم المتحركة التقليدية وغير الشائعة الموضوعة بواسطة CSS. اختر المدة ووظيفة التوقيت والتأخير وعدد التكرارات وبعض الخيارات الأخرى لفحص النتيجة.
51. Obnoxious.css
Obnoxious.css يأتي مع 5 الرسوم المتحركة القائمة على CSS فريدة من نوعها التي تجبر عناصر واجهة لزعزعة ، تطور ، تكبير ، تقليد تأثير القوية ، أو تغيير وزن محرف. كل ما عليك القيام به هو تطبيق الفئة المفضلة على div المطلوب.
52. Animatelo
Animatelo يتضمن الكثير من التأثيرات الديناميكية اللافتة للنظر والتي تم استعارتها من Animate.css الشهيرة والقوية ، مما يوفر طريقة أسهل لتطبيقها. بفضل Polyfill API رسوم متحركة API يتم دعمها من قبل جميع المتصفحات الحديثة.
53. Foxholder
Foxholder هي حزمة من 15 مؤثرات صغيرة لطيفة تم إنشاؤها خصيصًا لتحسين تفاعلات المستخدم مع النموذج. تشدد كل طريقة على حقل الإدخال بطريقتها الخاصة: حيث يمكن أن تجعل الحدود أكثر إشراقاً ، وإضافة أدلة مرئية ، وتعيين النص المتحرك ، وأكثر من ذلك بكثير.
54. Rhythm.js
Rhythm.js هو كل شيء عن الرسوم المتحركة الصغيرة المستوحاة الديسكو مستوحاة. تحتوي مكتبة JavaScript هذه على تأثيرات تقلد نوعًا ما من حركات الرقص. هناك ما يقرب من 20 خيارًا سيضيف boogie-woogie إلى موقعك على الويب.
55. Colorido.js
يشبه إلى حد كبير Granim.js ، هذا المكون الإضافي الذي يدعم جافا سكريبت تم إنشاؤه لمعالجة خاصية اللون. يساعد على تغيير النغمات وعتامة الخلفية والنص ديناميكيًا ، بالإضافة إلى إنشاء تدرجات شعاعية وغير خطية وقطرية وأفقية غير ثابتة.
56. Barba.js
Barba.js يعزز PJAX (تقنية تعتمد على ajax) لتخفيف مستخدمي ما يسمى بتحويل التحديث الثابت بين الصفحات. يخفي فقط الحاوية القديمة ويظهر الحاوية الجديدة بأسلوب لطيف يرضي العين.
57. ScrollReveal.js
ScrollReveal.js هي أداة شائعة لإنشاء رسوم متحركة متحركة. مع طريقة كشفها الرئيسية () يمكنك إدارة الرسوم المتحركة المختلفة والتحكم في جميع جوانبها القياسية. الشيء العظيم هو أنه يعمل بشكل جيد مع كل من متصفحات الويب والهاتف المحمول.
58. Scrollanim
Scrollanim هي أداة أقل تعقيدًا ، ولكنها أكثر سهولة ، وأبسط ، لاستخدامها بدلاً من المثال السابق. على الرغم من أنه يفضل CSS3 ولكنه يسمح لك بإضافة الرسوم المتحركة باستخدام واجهة برمجة تطبيقات جافا سكريبت لإنتاج رسوم متحركة بالتمرير. لديها عدد من الحلول التي تم إنشاؤها مسبقا والتي يمكنك تقديمها بسرعة إلى مشروعك.
59. ScrollTrigger
بينما يركز الحلان السابقان بشكل رئيسي على التمرير الرأسي التقليدي ، هذا هو لبناء مواقع أفقية طويلة. فهو يتيح لك إنشاء واجهات ديناميكية في مستوى المحور السيني المملوء بحركات CSS3 جميلة باستخدام بنية بدائية بدلاً من ذلك.
60. Force.js
Force.js هو حل صغير يحرم من الوظائف الضخمة وثراء الخيارات. ومع ذلك ، فهو مثالي للمهام العادية مثل ضبط الكائنات في حركة خفية أو التمرير المسبق. كالمعتاد ، يكمن التخفيف في جوهره مما يجعل الرسوم المتحركة نظيفة ومرتبة.
61. AOS
AOS تقف لتتحرك على التمرير. يفعل ما يقوله - يوفر لك مجموعة من التأثيرات المحددة مسبقًا والحيوية التي يتم تشغيلها بواسطة حدث تمرير. إذا كنت ترغب في إعطاء أقسام مدخل مأساوي دون حفر عميق في التعليمات البرمجية فمن المؤكد أنه بالنسبة لك.
62. ريلاكس
Rellax هو للمناظر الجميلة. وهو مكتبة جافا سكريبت خفيفة الفانيليا لإعطاء لمسة خفية من الأبعاد 3D لواجهات.
63. Tilt.js
Tilt.js ينتج تأثير الميل للفضاء المنطلق من المنظر. سوف يقوم بتحريك الكائنات إلى وضع مائل يقلد ثلاثي الأبعاد في مستوى ثنائي الأبعاد أساسي. يمكنك إصلاح محور مما يجعل التأثير أكثر إثارة وإثارة للاهتمام ، أو إعادة إنشاء نوع من الشعور بالوهج أو العائمة.
64. التحويل
تحويل عندما هو حل رائع لتصميم تجارب رواية القصص مع أداء عالي ودعم أصلي للأجهزة المحمولة. انها تراهن على اثنين من المعالم الحيوية: الوقت وموقع التمرير مما يجعل مغامرة المستخدم من خلال واجهة يسيطر عليها بيقا من جانبكم. يعمل مع كل من SVG وعناصر HTML العادية.
65. الرسوم المتحركة CSS3
هذه هو مولد المدرسة القديمة مع معاينة حية لإنشاء الرسوم المتحركة CSS3 الأساسية. يوجد مركز تحكم قياسي حيث يمكنك ضبط مدة النقل وعدد التكرارات ووظائف التوقيت إلخ. الروتينية بسيطة: ضبط كل شيء ونسخ رموز HTML و CSS الناتجة ولصقها في مشروعك.
66. Curve.js
Curve.js يتنفس الحياة في خطوط مما يجعلها "الرقص" وتدور تماما مثل موجة. استخدمها لإنشاء خلفيات أو قطع فنية مستوحاة هندسية أنيقة.
67. Animator.js
Animator.js يقال أن تكون مرنة وفعالة وخفيفة. يقدم أسهل طريقة لإدارة الإطارات المفتاحية وإنشاء رسوم متحركة CSS بمقاييس مختلفة. هو أيضا التبعية الحرة.