javascript - 単純なモーション UI トランジションを試行すると、このエラーが発生します - Uncaught ReferenceError: MotionUI is not defined at HTMLAnchorElement.

Question

Foundation Zurb テンプレートを使用していますが、Motion UI ライブラリを使い始めるのに苦労しています。これらのドキュメントに従って機能する要素の簡単な遷移を取得しようとしています:

ただし、コンソール エラーが発生し続けます。

Uncaught 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>

app.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 の組み込みクラスでもある程度成功しましたが、カスタム ミックスインを使用しようとすると、次のアニメーションが機能します。

.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);
}

なぜこれらのことが起こっているのか、私は少し混乱しています。