2015-07-03 50 views
-1

你们中的一些人可能熟悉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无法正常工作,试图用Textillate动画HTML元素

出于某种原因,我无法得到这个工作,我想我在加载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

正如你可以在上面的链接看到的,使用应该是非常基本的,我没有看到我做错了什么。

回答

0

前两个脚本依赖于jQuery,但您不会在它们之后加载jQuery。

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

更改您的<script>元素的顺序。

+0

我在编写代码时看到一个错误,我首先加载jQuery,然后编辑我的原始问题以更新代码。 –