Create a basic flip animation
There are certain animations that are commonly found in a lot of different applications. They are common because people are used to the way they feel, and they are good at conveying interactions and the meaning behind them. One of these types of animations is a flip animation where you have some content and then, through some sort of interaction, it needs to flip over and reveal the content from the opposite side. We’ll this is what we’re going to create in this video.
------------------------------------------------------------------------------
👕 Be the coolest developer in the room with these Angular tees! (https://www.teepublic.com/user/dev-drip)
------------------------------------------------------------------------------
📺 More Angular Animation Tutorial Videos: • Angular Animations
------------------------------------------------------------------------------
🔗 Demo Links:
Before (https://stackblitz.com/edit/stackblit...)
After (https://stackblitz.com/edit/stackblit...)
Using the Bootjack Bounce Library (https://stackblitz.com/edit/stackblit...)
------------------------------------------------------------------------------
📚 Additional Resources:
Introduction to Angular animations (https://angular.dev/guide/animations)
Bootjack Bounce Animation Library (https://www.npmjs.com/package/ngx-boo...)
------------------------------------------------------------------------------
📖 Chapters:
0:00 – Introduction
0:33 – Enabling Animations in Your Application
1:01 – Create and Add a Flip Animation
2:15 – Creating the Basic Flip Animation
5:26 – Binding the Animation in the Component Template
6:17 – Adding Basic CSS Needed for the Animation
7:52 – Switching the Flip Animation Direction
8:59 – Installing and Using the Bootjack Bounce Animation Library
9:47 – Adding the Animation from the Library
11:21 – Switching the Flip Animation Direction
12:18 – Customizing the Animation Duration with Params
13:18 – Conclusion
------------------------------------------------------------------------------
#angular #angulartutorial #animation
Смотрите видео Create a basic flip animation онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Brian Treese 23 Август 2024, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 92 раз и оно понравилось 4 людям.