jQuery的聲音播放倒計時鐘

-3

我正在尋找一個jquery倒計時時鐘或定時器開始與聲音播放時已設置日期。我發現很多網站有jquery倒計時的exapmles，但沒有聲音播放時，它開始計數時...jQuery的聲音播放倒計時鐘

我怎麼能聲音添加到一個Jquery倒計時器？

感謝

更新：這是mootool計時器http://jsfiddle.net/QH6X8/185/的演示，我想用一個聲音播放！任何想法如何做到這一點？ html代碼：

<div id="countdown"></div>

而且mootool代碼;

var end = new Date('16 May 2013 13:29:00'); // set expiry date and time.. 

var _second = 1000; 
var _minute = _second * 60; 
var _hour = _minute * 60; 
var _day = _hour *24 
var timer; 

function showRemaining() 
{ 
    var now = new Date(); 
    var distance = end - now; 
    if (distance < 0) { 
     // handle expiry here.. 
     clearInterval(timer); // stop the timer from continuing .. 
     alert('Expired'); // alert a message that the timer has expired.. 

     return; // break out of the function so that we do not update the counters with negative values.. 
    } 
    var days = Math.floor(distance/_day); 
    var hours = Math.floor((distance % _day)/_hour); 
    var minutes = Math.floor((distance % _hour)/_minute); 
    var seconds = Math.floor((distance % _minute)/_second); 
    var milliseconds = Math.floor((distance % _second)); 

    document.getElementById('countdown').innerHTML = 'Days: ' + days + '<br />'; 
    document.getElementById('countdown').innerHTML += 'Hours: ' + hours+ '<br />'; 
    document.getElementById('countdown').innerHTML += 'Minutes: ' + minutes+ '<br />'; 
    document.getElementById('countdown').innerHTML += 'Seconds: ' + seconds+ '<br />'; 
    document.getElementById('countdown').innerHTML += 'Milliseconds: ' + milliseconds+ '<br />'; 
} 

timer = setInterval(showRemaining, 1);

來源

2013-05-08 Digital site

查找倒計時插件，您喜歡視覺第一，那麼我們可以告訴你如何讓它播放聲音。 – 2013-05-08 06:18:18

好的，聽起來不錯。將盡快更新我的原始文章。謝謝 – 2013-05-08 07:12:59

最好的辦法是使用音頻插件解決方案。

最好的之一是howler.js。

來源

2013-05-08 06:18:23 mreq

謝謝，但我想在倒計時開始時播放聲音... – 2013-05-08 07:28:55

那麼，我們不打算爲你做:)顯示一些努力。 – mreq 2013-05-08 07:30:24

...... !!!好吧，這就是爲什麼我在尋找幫助，夥伴。我知道jquery和mootool倒計時如何工作，但不知道如何將代碼與聲音播放代碼結合時的樣子。 – 2013-05-08 08:21:29

使用howler.js作爲音頻插件。然後自定義您的custom.js這樣

var mySound = new Howl({ 
urls: ['yoursound.mp3'], 
autoplay: true 
});

對於倒數計時器使用本jquery.countdown

然後自定義您的custom.js這樣

$('#clock').countdown('2016/10/31').on('update.countdown', 
    function(event) {  
    var $this = $(this).html(event.strftime('' 
    + '<div><span>%-w</span>week%!w</div>' 
    + '<div><span>%-d</span>day%!d</div>' 
    + '<div><span>%H</span>hr</div>' 
    + '<div><span>%M</span>min</div>' 
    + '<div><span>%S</span>sec</div>')); 
});

來源

2016-06-11 03:25:31

jQuery的聲音播放倒計時鐘

回答

相關問題