無法使Textillate.js正常工作

我使用在線演示代碼來啓動並運行該庫，但即使如此，textilate.js仍然無法正常工作。我已經檢查了我可以多次想到的所有事情。無法使Textillate.js正常工作

不工作我的意思是沒有動畫效果的文字。

在錯誤控制檯中，它聲明：「ReferenceError：Can not find variable：$」。

實際的網址是：www.econengines.com。

下面是代碼（包括依賴）：

<link rel="stylesheet" href="animate.min.css"> 

<div class="tlt"> 
    <p>Each of these letters will animate.</p> 
</div> 

<script> 

$(document).ready(function(){ 
     $('.tlt').textillate({ in : { 
       shuffle: false, 
       sync: true 
      }, 
      out: { 
       effect: 'fadeOutRightBig', 
       shuffle: false, 
       sync: true 
      }, 
      loop: true 
     }); 
    }); 

</script> 

<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="lettering.min.js"></script> 
<script type="text/javascript" src="textillate.js"></script>

和FTP文件的快照：

我使用所謂MaterializeCSS Web框架，我也嘗試禁用以及MaterializeCSS js腳本，但它沒有效果。

我感謝您的輸入，並注意提前:-)

來源

2015-09-25 WΔ_

我複製你的代碼在這[JSFiddle]（https://jsfiddle.net/sajn8yL4/），它工作得很好。或者這不是預期的結果？如果是，請檢查控制檯是否有錯誤。 –

你能指定什麼*只是不工作*的意思？ –

謝謝你的回覆@AlvaroFlañoLarrondo！我更新了描述以包含對問題的回答。 –

它拍了一下你的源代碼，我意識到，你在呼喚加載JS庫前$(document).ready()功能。

您需要將這個

<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript" src="materialize.min.js"></script> 
<script type="text/javascript" src="lettering.min.js"></script> 
<script type="text/javascript" src="textillate.js"></script>

，並把它之前這

$(document).ready(function(){ 
    $('.tlt').textillate({ 
     in : { 
      shuffle: false, 
      sync: true 
     }, 
     out: { 
      effect: 'fadeOutRightBig', 
      shuffle: false, 
      sync: true 
     }, 
     loop: true 
    }); 
});

Rememeber在使用前總是加載庫和dependencieas。

來源

2015-09-25 17:15:19

它的工作原理！我現在對某些文字有Textillate效果。然而......當用移動設備查看時，「中心」路線不適用於相關文本。這就像網格系統不能正常工作....任何工作？ –

我認爲你應該在這裏提出一個新的問題來解決這個問題。那些知道更多的人可以幫助你。 –

無法使Textillate.js正常工作

回答

相關問題