jQuery點擊功能只有在嘗試使用Textillate.js動畫時纔會工作一次

Question

我想使用jQuery和Textillate.js設置動畫文本，但只能使用.click()一次;它需要刷新瀏覽器以點擊時爲文字設置動畫。我希望有人能幫幫忙。

我的HTML：

<h1 class="test">Im so handome!</h1> 

這是JavaScript

var asdf = $('.test'); 
asdf.click(function() { 
    asdf.textillate({ 
     in: { 
      effect: 'bounceIn' 
     } 
    }); 
}); 

Answer 1

您應該在點擊函數之外初始化textillate插件，然後在點擊函數中觸發api。

這應該工作：

var asdf = $('.test'); 
asdf.textillate({ 
    autoStart: false, 
    in: { 
     effect: 'bounceIn' 
    } 
    }); 
var api = asdf.data('textillate'); 

asdf.click(function() { 
    api.start(); 
}); 

Answer 2

試試這個

var asdf = $('.test'); 
asdf.click(function() { 
    setInterval(function(){ 
    asdf.textillate({ 
    in: { 
     effect: 'bounceIn' 
    }}, 200); 
    }); 
}); 

200是每200毫秒爲單位之後的動畫。