2016-03-29 13 views
0

私は数えて(3月30日21:12 PM EST)の間にカウントアップしようとしています!私はグーグルだが、私はそれについてどうやって行くのか分からない。私が見てきたプラグイン/コードなど時間枠内でカウントアップ

(function($) { 
$.fn.countdown = function(options, callback) { 
//custom 'this' selector 
thisEl = $(this); 

// array of custom settings 
var settings = { 
'date': null, 
'format': null 
}; 

// append the settings array to options 
if(options) { 
$.extend(settings, options); 
} 

//create the countdown processing function 
function countdown_proc() { 
var eventDate = Date.parse(settings.date)/1000; 
var currentDate = Math.floor($.now()/1000); 

if(eventDate <= currentDate) { 
callback.call(this); 
clearInterval(interval); 
} 

var seconds = eventDate - currentDate; 

var days = Math.floor(seconds/(60 * 60 * 24)); 
//calculate the number of days 

seconds -= days * 60 * 60 * 24; 
//update the seconds variable with number of days removed 

var hours = Math.floor(seconds/(60 * 60)); 
seconds -= hours * 60 * 60; 
//update the seconds variable with number of hours removed 

var minutes = Math.floor(seconds/60); 
seconds -= minutes * 60; 
//update the seconds variable with number of minutes removed 

//conditional statements 
if (days == 1) { thisEl.find(".timeRefDays").text("day"); } else { thisEl.find(".timeRefDays").text("days"); } 
if (hours == 1) { thisEl.find(".timeRefHours").text("hour"); } else { thisEl.find(".timeRefHours").text("hours"); } 
if (minutes == 1) { thisEl.find(".timeRefMinutes").text("minute"); } else { thisEl.find(".timeRefMinutes").text("minutes"); } 
if (seconds == 1) { thisEl.find(".timeRefSeconds").text("second"); } else { thisEl.find(".timeRefSeconds").text("seconds"); } 

//logic for the two_digits ON setting 
if(settings.format == "on") { 
days = (String(days).length >= 2) ? days : "0" + days; 
hours = (String(hours).length >= 2) ? hours : "0" + hours; 
minutes = (String(minutes).length >= 2) ? minutes : "0" + minutes; 
seconds = (String(seconds).length >= 2) ? seconds : "0" + seconds; 
} 

//update the countdown's html values. 
thisEl.find(".days").text(days); 
thisEl.find(".hours").text(hours); 
thisEl.find(".minutes").text(minutes); 
thisEl.find(".seconds").text(seconds); 
} 

//run the function 
countdown_proc(); 

//loop the function 
interval = setInterval(countdown_proc, 1000); 
}; 

}) (jQuery); 



//Provide the plugin settings 
$("#countdown").countdown({ 
//The countdown end date 
date: "30 March 2016 21:12:00", 

// on (03:07:52) | off (3:7:52) - two_digits set to ON maintains layout consistency 
format: "on" 
}, 

function() { 
// This will run when the countdown ends 
$(".flash").addClass("show"); 
$("ul#countdown").addClass("hide"); 
$(".black").addClass("new"); 


}); 

これは、01日、30時間、10分5秒を返し秒、分、時間を、持っているだけでカウントダウンプラグインです。

私は本当にわずか4つの数字、それは行うことができますどのように2112、航海時間をしたいですか?

答えて

1

基本のカウントアップスクリプトは次のようになります。jsfiddle

var second = 1000; // ms 
var i = 0; 
var timer = setInterval(function() { 
    if (i < 2112) { 
     i++; 
     console.log(i); 
    } else { 
     clearInterval(timer); 
    } 
}, second); // <- You'd change this second to some other value. 

その後、あなたは明日の日付を取る必要があるだろう:

var maxTime = Date.parse('Wed Mar 30 2016 21:12:00 EDT'); 

そして、今日の日付:

var timeNow = Date.now(); 

その差を減算:

バック新しい日付にそれをフォーマットすることで
var timeDiff = maxTime - timeNow; 

、あなたの特定のニーズ(AKA「航海時間」)にタイマーを調整するためにJS Dateオブジェクトのメソッドで遊ぶことができます

var dateDiff = new Date(timeDiff); 
console.log(dateDiff.getMinutes()); 

JSのDateオブジェクトを参照してください。 APIドキュメント:http://www.w3schools.com/jsref/jsref_obj_date.aspまたはhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse

次に、コードの末尾にあるsecondの値を変更します。それは、それに渡された時間に基づいて増加します。あなたは明日&今までの時間の2112等分にしたいのであれば、あなたはtimeDiff/2112 &その値にそれらの結果をフィードを分けると思います。

重要な注意:あなたは、彼らがコードをロードしたとき、あなたはそれをテストし、それ&を書き終えた後、あなたの時間増分は、他の誰かの時間増分よりも長くなり、それを行う場合。だからあなたは、あなたの時間の増分がどんなものであるべきかを理解するために、日付オブジェクトで遊ぶ必要があります。私は、動的&彼らは静的ではなくなってお勧めします。 (間隔としてtimeDiff/2112を使用しないでください)。

関連する問題