@wizdm/animate
Version:
On Scroll Animation for Angular
16 lines • 3.25 kB
JavaScript
import { state, animate, style, transition, keyframes } from '@angular/animations';
export const hinge = [
state('hinge', style({ opacity: 0 })),
transition('* => hinge', [
style({ transformOrigin: 'top left' }),
animate('{{timing}} {{delay}} ease-in-out', keyframes([
style({ transform: 'rotate3d(0, 0, 1, 0', offset: 0 }),
style({ transform: 'rotate3d(0, 0, 1, 80deg)', offset: 0.2 }),
style({ transform: 'rotate3d(0, 0, 1, 60deg)', offset: 0.4 }),
style({ transform: 'rotate3d(0, 0, 1, 80deg)', offset: 0.6 }),
style({ transform: 'rotate3d(0, 0, 1, 60deg)', offset: 0.8 }),
style({ transform: 'translateY(700px)', offset: 1 })
]))
], { params: { timing: '2s', delay: '' } })
];
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGluZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9hbmltYXRlL3NyYy9saWIvZXhpdHMvaGluZ2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUVuRixNQUFNLENBQUMsTUFBTSxLQUFLLEdBQUc7SUFFbkIsS0FBSyxDQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsRUFBRSxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBRTtJQUV0QyxVQUFVLENBQUMsWUFBWSxFQUFFO1FBRXZCLEtBQUssQ0FBQyxFQUFFLGVBQWUsRUFBRSxVQUFVLEVBQUUsQ0FBQztRQUV0QyxPQUFPLENBQUMsa0NBQWtDLEVBRXhDLFNBQVMsQ0FBQztZQUNSLEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSxxQkFBcUIsRUFBRSxNQUFNLEVBQUUsQ0FBQyxFQUFFLENBQUM7WUFDdEQsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsQ0FBQztZQUM3RCxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsMEJBQTBCLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxDQUFDO1lBQzdELEtBQUssQ0FBQyxFQUFFLFNBQVMsRUFBRSwwQkFBMEIsRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLENBQUM7WUFDN0QsS0FBSyxDQUFDLEVBQUUsU0FBUyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsQ0FBQztZQUM3RCxLQUFLLENBQUMsRUFBRSxTQUFTLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxFQUFFLENBQUMsRUFBRSxDQUFDO1NBQ3JELENBQUMsQ0FFSDtLQUFDLEVBQUUsRUFBRSxNQUFNLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsRUFBQyxDQUMzQztDQUNGLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBzdGF0ZSwgYW5pbWF0ZSwgc3R5bGUsIHRyYW5zaXRpb24sIGtleWZyYW1lcyB9IGZyb20gJ0Bhbmd1bGFyL2FuaW1hdGlvbnMnO1xyXG5cclxuZXhwb3J0IGNvbnN0IGhpbmdlID0gW1xyXG5cclxuICBzdGF0ZSgnaGluZ2UnLCBzdHlsZSh7IG9wYWNpdHk6IDAgfSkgKSxcclxuXHJcbiAgdHJhbnNpdGlvbignKiA9PiBoaW5nZScsIFtcclxuXHJcbiAgICBzdHlsZSh7IHRyYW5zZm9ybU9yaWdpbjogJ3RvcCBsZWZ0JyB9KSxcclxuICAgIFxyXG4gICAgYW5pbWF0ZSgne3t0aW1pbmd9fSB7e2RlbGF5fX0gZWFzZS1pbi1vdXQnLCBcclxuXHJcbiAgICAgIGtleWZyYW1lcyhbXHJcbiAgICAgICAgc3R5bGUoeyB0cmFuc2Zvcm06ICdyb3RhdGUzZCgwLCAwLCAxLCAwJywgb2Zmc2V0OiAwIH0pLFxyXG4gICAgICAgIHN0eWxlKHsgdHJhbnNmb3JtOiAncm90YXRlM2QoMCwgMCwgMSwgODBkZWcpJywgb2Zmc2V0OiAwLjIgfSksXHJcbiAgICAgICAgc3R5bGUoeyB0cmFuc2Zvcm06ICdyb3RhdGUzZCgwLCAwLCAxLCA2MGRlZyknLCBvZmZzZXQ6IDAuNCB9KSxcclxuICAgICAgICBzdHlsZSh7IHRyYW5zZm9ybTogJ3JvdGF0ZTNkKDAsIDAsIDEsIDgwZGVnKScsIG9mZnNldDogMC42IH0pLFxyXG4gICAgICAgIHN0eWxlKHsgdHJhbnNmb3JtOiAncm90YXRlM2QoMCwgMCwgMSwgNjBkZWcpJywgb2Zmc2V0OiAwLjggfSksXHJcbiAgICAgICAgc3R5bGUoeyB0cmFuc2Zvcm06ICd0cmFuc2xhdGVZKDcwMHB4KScsIG9mZnNldDogMSB9KVxyXG4gICAgICBdKVxyXG5cclxuICAgICldLCB7IHBhcmFtczogeyB0aW1pbmc6ICcycycsIGRlbGF5OiAnJyB9fVxyXG4gIClcclxuXTtcclxuIl19