提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

[Angular2 Animation] Delay and Ease Angular 2 Animations

Angular and animation Angular2 delay
2023-09-14 08:59:19 时间

By default, transitions will appear linearly over time, but proper animations have a bit more customization to them by delaying when they start and controlling how slowly or quickly they move over time.

 

    animations:[
        trigger('signal', [
            state('void', style({
                'transform':'translateY(-100%)'
            })),
            state('go', style({
                'background-color':'green',
                'height':'100px'
            })),
            state('stop', style({
                'background-color':'red',
                'height':'50px'
            })),
            transition('* => *', animate('2s 1s cubic-bezier(0.455, 0.03, 0.515, 0.955)'))
        ])
    ]

 Duration 2s, Delay 1s.

相关文章