0

私は小さく、左上隅に配置されたカウントダウン関数(コードは以下にあります)を持っています。

サイズ、アライメント、バックカラー、フォアカラーをカスタマイズできるようにしたいと思います。また、タイマーを停止、開始、およびクリアするためのボタンが必要です。2 つ目は、カウンターが最初に「00:00:00」を表示し、「00:00:59」に達したら、1 分経過したことを示す「00:01:00」にロールオーバーすることです。合格した。

望ましい視覚効果を得るためにこれを行うには、CSS/HTML が最も適切な言語だと思いますが、Javascript にはよ​​り算術/解析機能があるようです。

<br><script language="JavaScript">
function calcage(secs, num1, num2) {
    s = ((Math.floor(secs/num1))%num2).toString();
    if (LeadingZero && s.length < 2) {
        s = "0" + s;
        return "<b>" + s + "</b>";
    }
}

function CountBack(secs) {
    if (secs < 0) {
        document.getElementById("cntdwn").innerHTML = FinishMessage;
        return;
    }
    DisplayStr = DisplayFormat.replace(/%%D%%/g,calcage(secs,86400,100000));
    DisplayStr = DisplayStr.replace(/%%H%%/g, calcage(secs,3600,24));
    DisplayStr = DisplayStr.replace(/%%M%%/g, calcage(secs,60,60));
    DisplayStr = DisplayStr.replace(/%%S%%/g, calcage(secs,1,60));

    document.getElementById("cntdwn").innerHTML = DisplayStr;
    if (CountActive) {
        setTimeout("CountBack(" + (secs+CountStepper) + ")", SetTimeOutPeriod);
    }
}

function putspan(backcolor, forecolor) {
    document.write("<span id='cntdwn' style='background-color:" + backcolor + "; color:" + forecolor + "'></span>");
}

if (typeof(BackColor)=="undefined") {
    BackColor = "black";
}
if (typeof(ForeColor)=="undefined") {
    ForeColor= "white";
}
if (typeof(TargetDate)=="undefined") {
    TargetDate = "12/31/2050 5:00 AM";
}
if (typeof(DisplayFormat)=="undefined") {
    DisplayFormat = "%%H%%:%%M%%:%%S%%";
}
if (typeof(CountActive)=="undefined") {
    CountActive = true;
}
if (typeof(FinishMessage)=="undefined") {
    FinishMessage = "";
}
if (typeof(CountStepper)!="number") {
    CountStepper = -1;
}
if (typeof(LeadingZero)=="undefined") {
    LeadingZero = true;
}


CountStepper = Math.ceil(CountStepper);
if (CountStepper == 0) {
    CountActive = false;
}
var SetTimeOutPeriod = (Math.abs(CountStepper)-1)*1000 + 990;
putspan(BackColor, ForeColor);
var dthen = new Date(TargetDate);
var dnow = new Date();
if(CountStepper>0) {
    ddiff = new Date(dnow-dthen);
}
else {
    ddiff = new Date(dthen-dnow);
}
gsecs = Math.floor(ddiff.valueOf()/1000);
CountBack(gsecs);
</script>
4

1 に答える 1

0

JavaScript Date オブジェクトを使用して、時間カウンターでミリ秒を合計し、ミリ秒を時間としてフォーマットする、より単純なソリューションを使用します。

いくつかの参照: Date オブジェクトと関数: http://w3schools.com/jsref/jsref_obj_date.asp

于 2013-02-03T03:25:24.350 に答える