آموزش انیمیشن CSS با انتقال و تغییر شکل

مبانی انتقال CSS CSS Transition Fundamentals

• خوش آمدی Welcome

• الزامات دوره Course Requirements

• خصوصیات انتقال CSS CSS Transition Properties

• انتقال CSS: چگونه کار می کند؟ CSS Transition: How It Works?

• پشتیبانی از مرورگر و پیشوندهای فروشنده Browser Support and Vendor Prefixes

• نسخه ی نمایشی: آبی به سبز Demo: Blue to Green

• نسخه ی نمایشی: مربع به دایره Demo: Square to Circle

• نسخه ی نمایشی: ویژگی انتقال تاخیر Demo: the Transition-delay Property

• با استفاده از مختصر نویسی Using the Shorthand

CSS Transition و 2D Transform CSS Transition and 2D Transform

• مقدمه Introduction

• مقدمه ای بر 2D Transform Introduction to 2D Transform

• خاصیت Transform The Transform-property

• روش skew () The skew() method

• روش مقیاس () The scale() method

• روش چرخش () The rotate() method

• روش ترجمه () The translate() method

• با استفاده از عملکرد-زمان-انتقال Using Transition-timing-function

• آموزش: چرخ دنده های دوار Tutorial: The Rotating Gears

• آموزش: دوچرخه سوار Tutorial: The Bike Rider

تبدیل و متحرک سازی به صورت سه بعدی Transforming and Animating in 3D

• مقدمه Introduction

• چشم انداز Perspective

• تبدیل 3D CSS CSS 3D Transform

• نمایش های انتقال سه بعدی 3D Transition Demonstrations

• ورق زدن تصاویر Flipping the Pictures

• ایجاد مکعب 3D Creating the 3D Cube

• متحرک سازی مکعب 3D Animating the 3D Cube

پروژه نهایی - پیست اسکی Whistler White Final Project - Whistler White Ski Resort

• مقدمه Introduction

• طراحی با 2D Transform Designing with 2D Transform

• متحرک سازی پیوندهای پیمایش Animating the Navigation Links

• استفاده از چندین اثر گذار Applying Multiple Transition Effects

• تصاویر گالری: مقیاس بندی با انتقال 2D Gallery Pictures: Scaling Up with 2D Transition

• تصاویر گالری: چرخش به صورت سه بعدی Gallery Pictures: Rotation in 3D

• با یک لینک دکمه اصلی با ما تماس بگیرید Contact Us with an Original Button Link

• نتیجه Conclusion