出動畫textillate.js不工作

Question

我的代碼如下：

<div class="header"> 
<h1>My text</h1> 
</div> 
<script> 
$(function(){ 
    $('h1').textillate({in:{} , out:{effect:'hinge'}}); 
}); 
</script> 

在這方面，in-animation效果很好，但out-animation不起作用。你可以參考textillate.js jquery plugin docs。

Answer 1

的淡出效果纔會運行，以此來過渡到在不幸影響下。嘗試使用空文本作爲下一個轉變：

// html 
<h1 class="tlt"> 
    <ul class="texts"> 
     <li>Some Title</li> 
     <li> </li> 
    </ul> 
</h1> 

// javascript 
$('.tlt').textillate(); 

的jsfiddle：http://jsfiddle.net/jschr/y9m3b/

https://github.com/jschr/textillate/issues/5

Answer 2

偉大的插件！如果不使用loop: true選項我不能讓工作出來的效果：

$(function() { 
    $('h1').textillate({ in : { 
      effect: 'fadeInLeftBig' 
     }, 
     out: { 
      effect: 'hinge' 
     }, 
     loop: true 
    }); 
}); 

工作小提琴：http://jsfiddle.net/IrvinDominin/zHKLC/2/

Answer 3

這是一個應該被固定的缺陷，但回調使什麼是不可能的，所以我用做一些非常酷的事情。我解決了這個問題。上的參數回調函數

​​

Answer 4

使用$ element.textillate（「出」），它的工作原理

Answer 5

添加textilate（「出來」）的回調函數工作過的「中」效應爲了我。

此代碼執行'fadeIn'效果後的'fadeOut'效果。

$('.myclass').textillate({ 
    loop: false, 
    in : { 
     effect: 'fadeIn', 
     callback: function() { 
      $('.myclass').textillate('out'); 
     } 
    }, 
    out: { 
     effect: 'fadeOut', 
    } 
});