Lynda - CSS Transitions and Transforms
- کاربرد : آموزش کار با Transition ها و Transform ها در CSS
- نوع فایل : فیلم آموزشی
- زبان : انگلیسی
- سیستم عامل : Windows-Mac-Linux-Android-iOS
- تولید کننده : Lynda
- سال تولید : 2012
توضیحات
همانطور که می دانید از CSS برای فرمت دهی و طرح بندی، تعریف سبک متن (مانند نوع قلم، رنگ و اندازهها)، اندازه جدول و جنبه های دیگری از صفحات وب که قبلا فقط در فایل HTML یک صفحه قابل تعریف بوده است استفاده می شود CSS دارای خاصیت ها و افکت های مختلفی است که تنها با نوشتن قطعه کدهای ساده می توانند به ظاهر وب سایت شما دید ویژه ای اضافه کنند
به وسیله خاصیت Transition در CSS، می توانید تغییر اندازه، شکل، رنگ، موقعیت و یک عنصر را از یک حالت به یک حالت دیگر به صورت تدریجی و در قالب یک افکت تصویری، انیمیشن سازی کنید به عنوان مثال فرض کنید، شما یک عکس دارید که نمونه کوچک آن را بر روی صفحه قرار داده اید و قصد دارید تا زمانی که کاربر موس خود را بر روی آن می برد، به صورت تدریجی به اندازه بزرگ و اصلی خود در بیاید و کاربر آن را مشاهده نماید و هنگامی که کاربر موس خود را از روی آن می برد، به انداز قبلی و کوچک خود بر گردد
خاصیت Transform در سی اس اس، این امکان را به ما می دهد که یک متن یا یک بخش را به شکل مورد علاقه ی خود بچرخوانیم، به عنوان مثال می توانید یک متن را در سایت خود با چرخش نشان دهید
این افکت ها از قابلیت های منحصر به فرد در CSS مب باشند که تنها با نوشتن یک قطعه کد ساده امکانپذیر خواهند بود
به وسیله خاصیت Transition در CSS، می توانید تغییر اندازه، شکل، رنگ، موقعیت و یک عنصر را از یک حالت به یک حالت دیگر به صورت تدریجی و در قالب یک افکت تصویری، انیمیشن سازی کنید به عنوان مثال فرض کنید، شما یک عکس دارید که نمونه کوچک آن را بر روی صفحه قرار داده اید و قصد دارید تا زمانی که کاربر موس خود را بر روی آن می برد، به صورت تدریجی به اندازه بزرگ و اصلی خود در بیاید و کاربر آن را مشاهده نماید و هنگامی که کاربر موس خود را از روی آن می برد، به انداز قبلی و کوچک خود بر گردد
خاصیت Transform در سی اس اس، این امکان را به ما می دهد که یک متن یا یک بخش را به شکل مورد علاقه ی خود بچرخوانیم، به عنوان مثال می توانید یک متن را در سایت خود با چرخش نشان دهید
این افکت ها از قابلیت های منحصر به فرد در CSS مب باشند که تنها با نوشتن یک قطعه کد ساده امکانپذیر خواهند بود
Description
With robust and ever-increasing browser support, it is now possible to take advantage of expressive CSS3 capabilities across modern browsers In this course, Joseph Lowery explores the possibilities of the new coding options, which animate well over 50 different properties automatically or interactively, and how they open the door to enhanced user experiences This course covers the range from simple to complex transitions, including 2D and 3D transforms, and illustrates how transitions are expedited in various web authoring tools, as well as Dreamweaver The course also contains a start-to-finish interactive slideshow project that allows you to practice and see the transitions and transforms immediately in action
Topics include:
Understanding transition basics
Working with 2D and 3D transforms
Animating color changes
Fading objects
Changing the size of page elements and fonts
Transitioning multiple properties at the same time
Understanding keyframes and animations
Working in the z-index
Adding JavaScript interactivity
Crafting transitions in Dreamweaver
Topics include:
Understanding transition basics
Working with 2D and 3D transforms
Animating color changes
Fading objects
Changing the size of page elements and fonts
Transitioning multiple properties at the same time
Understanding keyframes and animations
Working in the z-index
Adding JavaScript interactivity
Crafting transitions in Dreamweaver