css3动画

html

<div class="a4">
                    <a href="" class="a5"></a>
                    <div class="a6">
                        <div class="a7"></div>
                    </div>
                    <a href="" class="a8">
                        <div class="a9"></div>
                    </a>
                    <a class="a10" href="">
                        <div class="a11"></div>
                    </a>
                    <a class="a12" href="">
                        <div class="a13"></div>
                    </a>
</div>

 

css

@keyframes myfirst
{
from {transform: translate(0px,0px);}
to {transform: translate(10px,20px);}
}
.a4 div:hover{
    animation: myfirst .5s linear 3 alternate;
}