从底部褪色并同时旋转

Question

我有一个div绝对居中，我想从底部淡入并同时旋转360度但我无法管理它。

这是我的代码：

<div class="centerRow" id="centerRow">
</div>

的CSS：

.centerRow {
position: absolute;
width: 100%;
height: 200px;
bottom: 0;
top: 0;
margin: auto 0;
opacity: 0;
-moz-transform: translate(0,200%) rotate(0deg); 
-o-transform: translate(0,200%) rotate(0deg);
-ms-transform: translate(0,200%) rotate(0deg); 
-webkit-transform: translate(0,200%) rotate(0deg); 
transform: translate(0,200%) rotate(0deg);
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}

.centerRow-animate
{
    opacity: 1;
    -moz-transform: translate(0,0%) rotate(360deg); 
    -o-transform: translate(0,0%) rotate(360deg);
    -ms-transform: translate(0,0%) rotate(360deg); 
    -webkit-transform: translate(0,0%) rotate(360deg); 
    transform: translate(0,0%) rotate(360deg);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    }

jquery的：

$("#centerRow").addClass("centerRow-animate");

如果有人可以提供帮助我会很感激！