1

我正在使用 Foundation Zurb 模板，但在开始使用 Motion UI 库时遇到了困难。我正在尝试按照这些文档对元素进行简单的转换：

但是，我不断收到控制台错误：

未捕获的 ReferenceError：MotionUI 未在 HTMLAnchorElement 中定义。

的HTML：

<a class="button" id="button">Toggle Panel</a>

<div class="panel" id="panel">
    <p>Lorem ipsum dolor sit amet!</p>
</div>

应用程序.js：

var $button = $('#button');
var $panel = $('#panel');

$button.click(function() {
  if ($panel.is(':visible')) {
    MotionUI.animateOut($panel, 'fadeOut');
  }
  else {
    MotionUI.animateIn($panel, 'fadeIn');
  }
});

$(document).foundation();

我在 Motion UI 的内置类方面也取得了一些成功，但是当我尝试使用自定义 mixins 时，这个动画会起作用：

.slide-in-nav {
    @include mui-animation(slide(in, right));
    animation-duration: 0.4s;
}

而这种转变不会：

.fade-in-nav {
    // A long, long fade
    @include mui-fade(in, $duration: 10s);
}

我有点困惑为什么会发生这些事情。

4

0 回答 0