本文整理匯總了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();
}