برای مشاهده‌ی ویدیو لطفاً آن را خریداری کنید.

سرفصل ها

بخش 1 : دکمه‌ی متحرک با استفاده از انیمیشن‌ها در CSS
00:00:05
Reply Icon

یادداشتی وجود ندارد.

منابع و متریال آموزشی

ندارد.

Video Player is loading.
cvt-81. 85 - animated button with css animation.mp4

دکمه‌ی متحرک با استفاده از انیمیشن‌ها در CSS

Animated Button with CSS Animation

دوره: طراحی صد پروژه‌ی انیمیشن و افکت‌ حرکتی با CSS

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

level icon سطح : مقدماتی تا متوسطه
typeIcon نوع : با زیرنویس