大屏左右下载入的动画

@keyframes leftAnimation {
    0% {
        transform: translate(-100%, 0);
        opacity: 0;
    }

    100% {
        transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes rightAnimation {
    0% {
        transform: translate(100%, 0);
        opacity: 0;
    }

    100% {
        transform: translate(0, 0);
        opacity: 1;
    }
}

@keyframes bottomAnimation {
    0% {
        transform: translate(0, 100%);
        opacity: 0;
    }

    100% {
        transform: translate(0, 0);
        opacity: 1;
    }
}

animation: rightAnimation .5s linear 0s 1 normal;
animation: leftAnimation .5s linear 0s 1 normal;
animation: bottomAnimation 1s linear 0s 1 normal;