Как отменить анимацию CSS3 на первой итерации (а не на второй)

У меня есть анимация CSS3, как это:

@-webkit-keyframes slidein {
    from { -webkit-transform: translateX(100%); }
    to   { -webkit-transform: translateX(0); }
}

Как изменить эту анимацию на определение класса?

Например:

.slideinTransition {
    -webkit-animation-name: slidein;
    -webkit-animation-direction: alternate;
}

Это изменит анимацию на второй итерации, я бы хотел отменить ее прямо на первой итерации.

Ответы

Попробуйте следующее:

-webkit-animation-direction: alternate-reverse;

-webkit-animation: slidein 2s ease-out -2s infinite alternate forwards;

Просто запустите анимацию - [продолжительность] сек, чтобы сразу перейти во вторую анимацию;)

Не совсем уверен, о чем вы говорите, но, конечно же, перевернув "от" и "до значений", он будет запускаться в обратном направлении в первый раз.