在Unslider容器中動畫文本

我在嘗試調用一個函數，該函數會在unslider容器中一個接一個地褪色到標題文本中。最好的方法是在每個幻燈片切換完成後大概調用一個函數。在Unslider容器中動畫文本

但我似乎無法得到在Unslider中使用'complete'選項調用的函數。

即使下面的代碼是不是爲我工作：

$('.banner').unslider({ 
    complete: function() { 
     alert("Test"); 
    } 
});

滑塊工作正常，但功能進行動畫處理的標題文字不會被觸發。

我已經安裝了HTML作爲Unslider網站

<div class="banner"> 
    <ul> 
     <li style="background-image: url('image1.jpg')"> 
       <h1> Heading 1 </h1> 
       <h2> Heading 2 </h1> 
     </li> 
     <li style="background-image: url('image2.jpg')"> 
       <h1> Heading 1 </h1> 
       <h2> Heading 2 </h1> 
     </li> 
    </ul> 
    </div>

我真不明白我在做什麼錯誤指示，如果有人可以告訴我怎麼會喜歡。

提前致謝！

來源

2014-09-04 tbhyn

你有任何錯誤拋出？您是否使用onload方法來調用您的腳本？對我來說它確實有效：http://jsfiddle.net/moumvyex/ – Kaiido 2014-09-04 09:18:14

@Kaiido 它很奇怪，但這是我發現的。使用「完成」選項的回調在我使用官方網站的unslider.js 文件時有效。我想要一個淡入淡出效果，而不是幻燈片效果，所以我使用了原始的[fork]（https://github.com/jeremymlane/unslider）。 '完整'選項在這個分叉的選項中不適用於我。 – tbhyn 2014-09-04 09:40:54

你可以給這個叉子的來源嗎？ – Kaiido 2014-09-04 09:52:29

看來complete事件還沒有被整合到這個新的分支中。
此行只是添加到您的.js文件L190獲得對事件的背部，同時使用fade : true

ul.find("li").eq(index).fadeIn(speed); 
    $.isFunction(o.complete) && !callback && o.complete(el, target);//add this line 
} else {

來源

2014-09-04 15:19:33 Kaiido

很棒的發現！非常感謝你:) – tbhyn 2014-09-05 08:45:34

我嘗試過upvote，但是我沒有足夠的聲望去這樣做。對不起！ – tbhyn 2014-09-05 09:25:59

在Unslider容器中動畫文本

回答

相關問題