.loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
}

/* 绘制进度条图形 */
.myicon {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    width: 50px;
    height: 30px;
}

.myicon-item {
    width: 5px;
    height: 10px;
    background-color: green;
    float: left;
    margin-right: 5px;
    -webkit-animation: myicon 1s infinite;
    animation: myicon 1s infinite;
}

.item1 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.item2 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.item3 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

.item4 {
    -webkit-animation-delay: -0.7s;
    animation-delay: -0.7s;
}

.item5 {
    -webkit-animation-delay: -0.6s;
    animation-delay: -0.6s;
}

@-webkit-keyframes myicon {
    0% 100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }

    50% {
        -webkit-transform: scaleY(3);
        transform: scaleY(3);
    }
}

@keyframes myicon {
    0% 100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }

    50% {
        -webkit-transform: scaleY(3);
        transform: scaleY(3);
    }
}