加载外部JavaScript无法正常工作,尝试使用Textillate

时间:2015-07-03 22:07:36

标签: javascript jquery html css animation

你们中的一些人可能熟悉Textillate。 (https://jschr.github.io/textillate/)在网站上,它说要完全实现动画,我必须确保包含JQuery,animate.css(http://daneden.github.io/animate.css/)和lettering.js(https://github.com/davatron5000/Lettering.js)。当然,我还必须实现textillate.js文件。

出于某种原因,我无法使其工作,我认为我在加载javascript或JQuery文件时犯了一个错误。可悲的是,控制台没有显示任何错误,所以有点奇怪..

我的代码让它工作:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="jquery.lettering.js"></script>
<script src="jquery.textillate.js"></script>
<link rel="stylesheet" href="animate.css"/>

<h1 class="tlt" data-in-effect="rollIn">This should have a rollIn effect</h1>

它应该是一个非常简单的CSS动画。如果你们中的任何人都感兴趣,你可以在这里观看一个现场演示:http://codepen.io/jschr/pen/GaJCi

这是一个使用Textillate的小教程:https://github.com/jschr/textillate

正如您在上面的链接中看到的,用法应该是非常基本的,我看不出我做错了什么。

1 个答案:

答案 0 :(得分:0)

前两个脚本依赖于jQuery,但是你不要尝试加载jQuery直到它们之后。

在加载依赖于脚本的脚本之前,需要加载脚本的依赖项。

更改<script>元素的顺序。