@wizdm/animate
Version:
On Scroll Animation for Angular
26 lines • 5.39 kB
JavaScript
import { state, animate, style, transition } from '@angular/animations';
export const fadeOut = [
// Ending states
state('fadeOut', style({ opacity: 0 })),
state('fadeOutRight', style({ opacity: 0 })),
state('fadeOutLeft', style({ opacity: 0 })),
state('fadeOutDown', style({ opacity: 0 })),
state('fadeOutUp', style({ opacity: 0 })),
// Transitions
transition('* => fadeOut', [
animate('{{timing}} {{delay}} ease-out', style({ opacity: 0 }))
], { params: { timing: '1s', delay: '' } }),
transition('* => fadeOutRight', [
animate('{{timing}} {{delay}} ease-out', style({ opacity: 0, transform: 'translateX(20px)' }))
], { params: { timing: '1s', delay: '' } }),
transition('* => fadeOutLeft', [
animate('{{timing}} {{delay}} ease-out', style({ opacity: 0, transform: 'translateX(-20px)' }))
], { params: { timing: '1s', delay: '' } }),
transition('* => fadeOutDown', [
animate('{{timing}} {{delay}} ease-out', style({ opacity: 0, transform: 'translateY(20px)' }))
], { params: { timing: '1s', delay: '' } }),
transition('* => fadeOutUp', [
animate('{{timing}} {{delay}} ease-out', style({ opacity: 0, transform: 'translateY(-20px)' }))
], { params: { timing: '1s', delay: '' } })
];
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmFkZS1vdXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9hbmltYXRlL3NyYy9saWIvZXhpdHMvZmFkZS1vdXQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBRXhFLE1BQU0sQ0FBQyxNQUFNLE9BQU8sR0FBRztJQUVyQixnQkFBZ0I7SUFDaEIsS0FBSyxDQUFDLFNBQVMsRUFBRSxLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBRTtJQUN4QyxLQUFLLENBQUMsY0FBYyxFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFFO0lBQzdDLEtBQUssQ0FBQyxhQUFhLEVBQUUsS0FBSyxDQUFDLEVBQUUsT0FBTyxFQUFFLENBQUMsRUFBRSxDQUFDLENBQUU7SUFDNUMsS0FBSyxDQUFDLGFBQWEsRUFBRSxLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBRTtJQUM1QyxLQUFLLENBQUMsV0FBVyxFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFFO0lBRTFDLGNBQWM7SUFDZCxVQUFVLENBQUMsY0FBYyxFQUFFO1FBRXpCLE9BQU8sQ0FBQywrQkFBK0IsRUFBRSxLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQztLQUVoRSxFQUFFLEVBQUUsTUFBTSxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUMsQ0FBRTtJQUUzQyxVQUFVLENBQUMsbUJBQW1CLEVBQUU7UUFFOUIsT0FBTyxDQUFDLCtCQUErQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLGtCQUFrQixFQUFFLENBQUMsQ0FBQztLQUUvRixFQUFFLEVBQUUsTUFBTSxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUMsQ0FBRTtJQUUzQyxVQUFVLENBQUMsa0JBQWtCLEVBQUU7UUFFN0IsT0FBTyxDQUFDLCtCQUErQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLG1CQUFtQixFQUFFLENBQUMsQ0FBQztLQUVoRyxFQUFFLEVBQUUsTUFBTSxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUMsQ0FBRTtJQUUzQyxVQUFVLENBQUMsa0JBQWtCLEVBQUU7UUFFN0IsT0FBTyxDQUFDLCtCQUErQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLGtCQUFrQixFQUFFLENBQUMsQ0FBQztLQUUvRixFQUFFLEVBQUUsTUFBTSxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUMsQ0FBRTtJQUUzQyxVQUFVLENBQUMsZ0JBQWdCLEVBQUU7UUFFM0IsT0FBTyxDQUFDLCtCQUErQixFQUFFLEtBQUssQ0FBQyxFQUFFLE9BQU8sRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLG1CQUFtQixFQUFFLENBQUMsQ0FBQztLQUVoRyxFQUFFLEVBQUUsTUFBTSxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUMsQ0FBRTtDQUU1QyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgc3RhdGUsIGFuaW1hdGUsIHN0eWxlLCB0cmFuc2l0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvYW5pbWF0aW9ucyc7XHJcblxyXG5leHBvcnQgY29uc3QgZmFkZU91dCA9IFtcclxuXHJcbiAgLy8gRW5kaW5nIHN0YXRlc1xyXG4gIHN0YXRlKCdmYWRlT3V0Jywgc3R5bGUoeyBvcGFjaXR5OiAwIH0pICksXHJcbiAgc3RhdGUoJ2ZhZGVPdXRSaWdodCcsIHN0eWxlKHsgb3BhY2l0eTogMCB9KSApLFxyXG4gIHN0YXRlKCdmYWRlT3V0TGVmdCcsIHN0eWxlKHsgb3BhY2l0eTogMCB9KSApLFxyXG4gIHN0YXRlKCdmYWRlT3V0RG93bicsIHN0eWxlKHsgb3BhY2l0eTogMCB9KSApLFxyXG4gIHN0YXRlKCdmYWRlT3V0VXAnLCBzdHlsZSh7IG9wYWNpdHk6IDAgfSkgKSxcclxuXHJcbiAgLy8gVHJhbnNpdGlvbnNcclxuICB0cmFuc2l0aW9uKCcqID0+IGZhZGVPdXQnLCBbXHJcblxyXG4gICAgYW5pbWF0ZSgne3t0aW1pbmd9fSB7e2RlbGF5fX0gZWFzZS1vdXQnLCBzdHlsZSh7IG9wYWNpdHk6IDAgfSkpXHJcblxyXG4gIF0sIHsgcGFyYW1zOiB7IHRpbWluZzogJzFzJywgZGVsYXk6ICcnIH19ICksXHJcblxyXG4gIHRyYW5zaXRpb24oJyogPT4gZmFkZU91dFJpZ2h0JywgW1xyXG5cclxuICAgIGFuaW1hdGUoJ3t7dGltaW5nfX0ge3tkZWxheX19IGVhc2Utb3V0Jywgc3R5bGUoeyBvcGFjaXR5OiAwLCB0cmFuc2Zvcm06ICd0cmFuc2xhdGVYKDIwcHgpJyB9KSlcclxuXHJcbiAgXSwgeyBwYXJhbXM6IHsgdGltaW5nOiAnMXMnLCBkZWxheTogJycgfX0gKSxcclxuXHJcbiAgdHJhbnNpdGlvbignKiA9PiBmYWRlT3V0TGVmdCcsIFtcclxuXHJcbiAgICBhbmltYXRlKCd7e3RpbWluZ319IHt7ZGVsYXl9fSBlYXNlLW91dCcsIHN0eWxlKHsgb3BhY2l0eTogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWCgtMjBweCknIH0pKVxyXG5cclxuICBdLCB7IHBhcmFtczogeyB0aW1pbmc6ICcxcycsIGRlbGF5OiAnJyB9fSApLFxyXG5cclxuICB0cmFuc2l0aW9uKCcqID0+IGZhZGVPdXREb3duJywgW1xyXG5cclxuICAgIGFuaW1hdGUoJ3t7dGltaW5nfX0ge3tkZWxheX19IGVhc2Utb3V0Jywgc3R5bGUoeyBvcGFjaXR5OiAwLCB0cmFuc2Zvcm06ICd0cmFuc2xhdGVZKDIwcHgpJyB9KSlcclxuXHJcbiAgXSwgeyBwYXJhbXM6IHsgdGltaW5nOiAnMXMnLCBkZWxheTogJycgfX0gKSxcclxuXHJcbiAgdHJhbnNpdGlvbignKiA9PiBmYWRlT3V0VXAnLCBbXHJcblxyXG4gICAgYW5pbWF0ZSgne3t0aW1pbmd9fSB7e2RlbGF5fX0gZWFzZS1vdXQnLCBzdHlsZSh7IG9wYWNpdHk6IDAsIHRyYW5zZm9ybTogJ3RyYW5zbGF0ZVkoLTIwcHgpJyB9KSlcclxuXHJcbiAgXSwgeyBwYXJhbXM6IHsgdGltaW5nOiAnMXMnLCBkZWxheTogJycgfX0gKVxyXG4gIFxyXG5dOyJdfQ==