javascript - angularJs animate ng-repeat entrance -

i've got simple list of countries , i'm trying them animate on entrance can't seem find what's stopping working?

<ul>     <li ng-repeat="country in countries" type="country" class="slide">        <a ui-sref="state5"> {{country.name}}</a>     </li> </ul> 

css file:

.slide.ng-enter {     transition:0.5s linear all;     transform:translatey(-100px); } .slide.ng-enter.ng-enter-active {     transform:translatey(0); } 

animate.js file:

countryapp.animation('.slide', [         function() {             return {                 enter: function(element, donefn) {                     jquery(element).slidein(1000, donefn);                 }             }         }] 

can perhaps clarify me? thanks

your css style working firefox. if want chrome use -webkit prefix

.slide.ng-enter {     transition:0.5s linear all;     transform:translatey(-100px);     -webkit-transition:0.5s linear all;     -webkit-transform:translatey(-100px); } .slide.ng-enter.ng-enter-active {     transform:translatey(0);     -webkit-transform:translatey(0); }