简单的动画

//动画效果1
<div id="div">
    <div class="q1"></div>
    <div class="q2"></div>
</div>

#div{
    width: 200px;
    height: 200px;
    margin: 400px;
    position: relative;
}
.q2{
    width: 30px;
    height: 30px;
    border-radius: 100%;
    position: absolute;
    background-color: #eeca4b;
    z-index: 9;
}
.q1{
    width: 30px;
    height: 30px;
    border-radius: 100%;
    position: absolute;
    z-index: 3;
    animation: myani 2s ease infinite normal ;
    background-color:#faefc9;
}
@keyframes myani {

    form {
        opacity: 0.9;
        margin-left: 0;
    }
    to {
        /*z-index: -22;*/
        transform: scale(3);
        opacity: 0;
    }
}