https://store.snapchat.com/

我發(fā)現(xiàn)了這一頁(yè)他會(huì)先出圖
然後出現(xiàn)字
這要怎麼樣實(shí)現(xiàn)??？有經(jīng)過(guò)jquery嗎？

補(bǔ)充

.ba {
    animation: anm_img_1  5s forwards;
    -webkit-animation: anm_img_1 5s forwards;
    width: 247px;
}

@keyframes anm_img_1
{
  0%, 25% {
    opacity: 0;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  30%, 45% {
    opacity: 1;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  50% {
    opacity: 1;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
  }
  100% {
    position: absolute;
    top:-50px;
    left:50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    opacity: 1;
  }
}

<div class="transform50">
  <img class="ba" src="images/chatgether01.png">
</div>

我這樣跟他還是不太一樣
是哪裡寫(xiě)錯(cuò)？

字要怎麼出現(xiàn)這還真的考倒我了