/Javascript/AngularJS/Angular tab change smooth transition

Angular tab change smooth transition

.mat-tab-body {
    animation: fade-out 0.5s;
    opacity: 0;
}
.mat-tab-body.mat-tab-body-active {
    animation: fade-in 0.5s;
    opacity: 1;
}

@keyframes fade-in {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fade-out {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}

Source: stackoverflow.com

Similar codes

0 vote235 views1 answer
Angular npx
Javascript AngularJS
0 vote270 views1 answer
Angular scroll event on div chang width
Javascript AngularJS
0 vote261 views1 answer
Cannot find name 'Position' angular
Javascript AngularJS
9 votes239 views1 answer
Angular ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.
Javascript AngularJS
0 vote255 views1 answer
Npm font awesome 5 angular 7
Javascript AngularJS
0 vote237 views1 answer
Angular httpclient query params not working
Javascript AngularJS
0 vote256 views1 answer
Send data with emit angular
Javascript AngularJS
0 vote266 views1 answer
Best way to filter table in angular
Javascript AngularJS
0 vote259 views1 answer
How to convert date format using date pipe in angular
Javascript AngularJS
0 vote287 views2 answers
Angularjs - controllerAs
Javascript AngularJS