Bean0341 Bean0341 - 2 years ago 124
Javascript Question

Angular 2 multi step animation

I am curious as to whether or not it is possible to do multi step animation with angular 2. I have created a basic animation, where my button slides to the right upon clicking it. However I want to know if I am able to make the buttom move right, then down, or however many more movements I please. I have attempted the following with little success...

state('active', style({
transform: ' translatey(100%) translatex(100%) '

This basically makes the box move diagonally, because both translates are triggered at the same time. I want it to translate one step at a time. Any direction or help would be great. Thank you!


As requested plunker

Answer Source

Here's the plunker with the solution:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download