本文整理汇总了TypeScript中angular2/src/animate/animation_builder.AnimationBuilder.css方法的典型用法代码示例。如果您正苦于以下问题:TypeScript AnimationBuilder.css方法的具体用法?TypeScript AnimationBuilder.css怎么用?TypeScript AnimationBuilder.css使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类angular2/src/animate/animation_builder.AnimationBuilder
的用法示例。
在下文中一共展示了AnimationBuilder.css方法的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: toggle
toggle(isVisible: boolean){
let animBuilder = this._animationBuilder.css();
animBuilder.setDuration(500);
if (isVisible){
animBuilder.setFromStyles({ right: '-100%' })
.setToStyles({ right: '0' });
}
else{
animBuilder.setFromStyles({ right: '0' })
.setToStyles({ right: '-100%' });
}
animBuilder.start(this._el.nativeElement);
}
示例2: toggle
toggle(isVisible: boolean = false){
let animation = this._animationBuilder.css();
animation.setDuration(500);
if (!isVisible){
animation.setFromStyles({ opacity: '1' })
.setToStyles({ opacity: '0'});
}
else{
animation.setFromStyles({opacity: '0'})
.setToStyles({ opacity: '1' });
}
animation.start(this._el.nativeElement);
}
示例3: constructor
constructor(
private _ab: AnimationBuilder,
private _e: ElementRef,
private _slotService: SlotService
) {
this._id = this._slotService.register();
let slot = this._slotService.getSlot(this._id);
this._ab.css()
.setDuration(2000)
.setFromStyles({
'opacity': 0.3,
'position': 'fixed',
'left': `${Math.floor(window.innerWidth / 2 - 18)}px`,
'top': `${Math.floor(window.innerHeight / 2 - 18)}px`
})
.setToStyles({
'opacity': 1.0,
'left': `${slot.centerX - 18}px`,
'top': `${slot.centerY - 18}px`
})
.start(this._e.nativeElement);
}
示例4: constructor
constructor(animationBuilder:AnimationBuilder, private _el:ElementRef) {
this._animation = animationBuilder.css();
}