AngularJS ngAnimate讓div從div頂部滑動，而不是頁首

Question

我有一個顯示和隱藏div的按鈕。我只想讓div從div的頂部滑入和滑出，而不是從頁面頂部滑入。我將如何做到這一點？

控制器：

app.controller('myController', ['$scope', function ($scope) { 
    $scope.showDiv = true; 
}]); 

查看：

<div ui-view> 
    <button ng-click="showDiv = !showDiv">Toggle</button><br /> 
    <div ng-show="showDiv" style="border: solid 1px red"> 
     <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
    </div> 
</div> 

CSS：

.ng-hide-remove { 
    -webkit-animation: slideInDown 0.5s; 
    -moz-animation: slideInDown 0.5s; 
    -ms-animation: slideInDown 0.5s; 
    animation: slideInDown 0.5s; 
} 

.ng-hide-add { 
    -webkit-animation: slideOutUp 1s; 
    -moz-animation: slideOutUp 1s; 
    -ms-animation: slideOutUp 1s; 
    animation: slideOutUp 1s; 
    display: block !important; 
} 

Answer 1

包裹內的另一個你的分度overflow: hidden; position: relative;，並使用translate2d到內分度position: relative爲滑動好。