Exemple de code de la propriété CSS animation-direction.

<style>
div.box{ 
 border: 1px solid #666; width: 90%; margin-bottom:5px; padding:5px; 
 animation-duration : 5s; 
 animation-iteration-count : infinite; 
}

#animation-direction-alternate{
 animation-name : animation; 
 animation-direction : alternate; 
}
#animation-direction-normal{
 animation-name : animation; 
 animation-direction : normal; 
}
@keyframes animation{
 from {width: 90%}
 to {width: 100px; }
}
</style>

<div class="box" id="animation-direction-normal"> animation-direction : normal </div>
<div class="box" id="animation-direction-alternate"> animation-direction : alternate </div>