响应导航栏倒塌与AngularStrap动画 [英] Responsive navbar collapsing animation with AngularStrap

问题描述

我试图重新可折叠自引导响应导航栏与AngularStrap。

I'm trying to recreate collapsible Bootstrap responsive navbar with AngularStrap.

下面是 plunker ：

<div class="navbar navbar-inverse">
  <div class="container" bs-collapse start-collapsed="true">
      <div class="navbar-header">
          <button class="navbar-toggle" type="button" bs-collapse-toggle>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
          </button>
      </div>
      <div bs-collapse-target>
          <ul class="nav navbar-nav">
              <li>
                  <a href="#">Link</a>
              </li>
              <li>
                  <a href="#">Link</a>
              </li>
          </ul>
      </div>
  </div>
</div>

BS-崩溃指令适合引导导航栏很容易，但它不支持动画崩出来的框。

bs-collapse directive fits Bootstrap navbar quite easily, but it doesn't support collapsing animation out of the box.

如何可以做到？

有没有办法做到这一点下面的引导工作流程，并利用其的崩溃动画，而不是重新发明轮子（但简单的LESS /上海社会科学院混入，使得使用它也可以）？

Is there a way to do this following Bootstrap workflow and utilizing its .collapsing animation instead of re-inventing the wheel (but simple LESS/SASS mixin that makes use of it is also fine)?

推荐答案

要获得动画工作，你可能需要包括角运动和角motion.min.css 文件，该文件href=\"https://github.com/mgcrea/angular-motion\" rel=\"nofollow\">角运动包。 CSS文件的引用不是主要文件的一部分。我是pretty确信我发现引用在这里在计算器上，当我有类似的问题。

To get the animations working, you may need to include angular-motion AND the angular-motion.min.css file that's part of the angular-motion package. The reference to the CSS file isn't part of the main documentation. I'm pretty sure I found references to it here on StackOverflow when I had similar issues.

这篇关于响应导航栏倒塌与AngularStrap动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！