css3动画延迟出现有关问题

css3动画延迟出现问题
.jiage{overflow:hidden;width:72%;background:url(../images/bg_2.png);margin:0auto;position:absolute;left:14%;top:140px;z-index:1;animation:myFirst1.5slinear2s;-webkit-animation:myFirst1.5slinear2s;-o-animation:myFirst1.5slinear2s;-moz-animation:myFirst1.5slinear2s;-ms-animation:myFirst1.5slinear2s;}
@keyframesmyFirst
{
0%{top:-170px;}
100%{top:140px;}
}
@-webkit-keyframesmyFirst
{
0%{top:-170px;}
100%{top:140px;}
}

我想在页面加载后2s让这个动画播放，但是初始位置定在top：140px；这样动画前两秒会出现在页面中，2s后执行从-170-140这个动作，怎么能让他前2s不出现，2s后执行动画

------解决思路----------------------
用js来控制，2s过后，给该元素添加动画这部分的css
------解决思路----------------------

引用:

Quote: 引用:

用js来控制，2s过后，给该元素添加动画这部分的css

用setInterval（）这个来控制前面停顿的2s吗

这个方法会多次调用，意思是2s会执行一次你所写的方法，如果你只想执行一次就用setTimeout()。
ps：你首先要写一个方法，你这方法可以向你想要有动画的那个元素添加动画这段css。
------解决思路----------------------
animation有动画延迟的属性
animation-delay:2s;
-webkit-animation-delay:2s;
------解决思路----------------------

.jiage{overflow:hidden;width:72%;background:url(../images/bg_2.png);margin:0auto;position:absolute;left:14%;top:-170px;z-index:1;animation:myFirst1.5slinear2sforwards}
@keyframesmyFirst
{
0%{top:-170px;}
100%{top:140px;}
}