scrollmagicがうまくいかない

Question

scrollmagicとgsapを使い、スクロールして画面内に要素が入ったらフェードインさせたいのですが、スクロールする前に画面をリロードした時点で実行されてしまいます。

https://scrollmagic.io/examples/basic/simple_tweening.html
ちなみにこのデモを参考にしています。

<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/gsap.min.js"></script>
<script src="js/animation.gsap.min.js"></script>
<script src="js/ScrollMagic.min.js"></script>
<script src="js/debug.addIndicators.js"></script>
<script src="js/script.js"></script>

↓script.js

$(function(){
  var controller = new ScrollMagic.Controller();
  var tween = gsap.fromTo('#show', {opacity: 0, y: 100}, {opacity: 1, y: 0, duration: 3});
  var scene = new ScrollMagic.Scene({
							triggerElement: "#trigger"
						})
						.setTween(tween) // trigger a TweenMax.to tween
						.addIndicators({name: "1 (duration: 0)"}) // add indicators (requires plugin)
						.addTo(controller);
});

<script src="js/ScrollMagic.min.js"></script>の代わりに<script src="js/jquery.ScrollMagic.min.js"></script>を読み込んでみましたがだめでした。

原因がわかる方、教えていただけると幸いです。
よろしくお願いします。

Comments

[okina]

htmlも提示していただけますか？
consoleにエラーとかは出てませんか？

[KUBO3]

自己解決しました。ありがとうございます。

Answer 1

以下の読み込む順番を入れ替えたら解決しました。

<script src="js/animation.gsap.min.js"></script>
<script src="js/ScrollMagic.min.js"></script>