Html 角度转换不能完全工作_Html_Angularjs_Twitter Bootstrap_Css

Html 角度转换不能完全工作

html angularjs twitter-bootstrap css

Html 角度转换不能完全工作,html,angularjs,twitter-bootstrap,css,Html,Angularjs,Twitter Bootstrap,Css,我试图在导航栏中进行转换。它部分起作用了。我不知道为什么会这样 <style> nav { transition: all linear 0.5s; -webkit-transition: all linear 0.5s; height: 100px; } .ng-hide { height: 0; } p { margin-top:100px; } </style> <body ng-app="myApp"> <nav

我试图在导航栏中进行转换。它部分起作用了。我不知道为什么会这样

<style>
nav {
  transition: all linear 0.5s;
  -webkit-transition: all linear 0.5s;
  height: 100px;
}

.ng-hide {
  height: 0;
}

p {
margin-top:100px;
}

</style>

<body ng-app="myApp">    
<nav class="container-fluid navbar navbar-default navbar-fixed-top" role="navigation" ng-hide="myCheck">
    <div class="container">
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
            <a href=""></a>
        </div>
        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">

        </div>
    </div>
</nav>

<p>Hide the NAV: <input type="checkbox" ng-model="myCheck"><p>

<script>
var app = angular.module('myApp', ['ngAnimate']);
</script>
</body>


导航{
过渡：全线性0.5s；
-webkit过渡：全线性0.5s；
高度：100px；
}
生皮{
身高：0；
}
p{
边缘顶部：100px；
}
隐藏导航：
var-app=angular.module（'myApp'，['ngAnimate']）；

包括引导css、角度和角度动画库。

您是否检查了

ng hide

的功能？它的工作方式是它无法在过渡中工作的原因。你不能像现在这样做，但如果你想要过渡，你真的想使用ngAnimate。当我也使用ng animate时，过渡不起作用。实际上，ng hide显示为none。对吧?对。但是您没有正确使用ngAnimate。为了实现ngHide/ngShow的动画，您需要编写特定的CSS规则。检查文档：您是否检查了ng hide的功能？它的工作方式是它无法在过渡中工作的原因。你不能像现在这样做，但如果你想要过渡，你真的想使用ngAnimate。当我也使用ng animate时，过渡不起作用。实际上，ng hide显示为none。对吧?对。但是您没有正确使用ngAnimate。为了实现ngHide/ngShow的动画，您需要编写特定的CSS规则。检查文件：