translateY需要往下拖动一下页面才会动的原因是什么？

写了一个动画..需要往下拖动一下页面箭头才会动。这是什么原因呢？

@-webkit-keyframes hangtagMove {        
    0%{
        -webkit-transform: translateY(0%);
    }
    20%{
        -webkit-transform: translateY(10%);
    }
    40%{
        -webkit-transform: translateY(0%);
    }
    60%{
        -webkit-transform: translateY(10%);
    }
    80%{
        -webkit-transform: translateY(-10%);
    }
    100%{
        -webkit-transform: translateY(0%);
    }
}