2012-07-27 138 views
6

我有一個幻燈片我想自動播放和循環不斷。我發現了一些片段,可以讓我設置全球幻燈片持續時間,並使用帶有setInterval()調用的impress.next()來向前移動,但是我失去了爲每張幻燈片設置不同持續時間的能力。如何使impress.js幻燈片自動播放和循環

回答

26

我很高興與大家分享我的解決方案。如果你看到有改進的餘地,不要害羞。希望這可以幫助那裏的人。

<script> 
    var impress = impress(); 
    impress.init(); 

    document.addEventListener('impress:stepenter', function(e){ 
    if (typeof timing !== 'undefined') clearInterval(timing); 
    var duration = (e.target.getAttribute('data-transition-duration') ? e.target.getAttribute('data-transition-duration') : 2000); // use the set duration or fallback to 2000ms 
    timing = setInterval(impress.next, duration); 
    }); 
</script> 
+0

非常有幫助節省了很多時間。 +1爲此:) – 2013-07-30 11:15:57

+1

謝謝!這讓我朝着正確的方向前進。但是,我遇到了一些問題。在多個步驟中使用自定義數據轉換持續時間,很難在短時間內使幻燈片放慢速度。對我來說,用setTimeout(impress.next,duration)替換setInterval(impress.next,duration)會導致幻燈片以我想要的方式運行。 – SiPe 2015-05-07 09:30:58