2015-07-03 46 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,然後編輯我的原始問題以更新代碼。 –