I have setup a CSS3 animation like this:

@-webkit-keyframes slidein {

    from { -webkit-transform: translateX(100%); }

    to   { -webkit-transform: translateX(0); }

}

How do i reverse this animation on a class definition?

For example:

.slideinTransition {

    -webkit-animation-name: slidein;

    -webkit-animation-direction: alternate;

}

This will reverse the animation on the second iteration, i would like to reverse it directly on the first iteration.