[Back]

Realtime Clock
〜デジタルストップウオッチ 〜


■ プレビュー

ストップウォッチ



■ ソース

<SCRIPT>
<!--
preImage = new Array(16);
for(i=0;i<16;i++)
{
        preImage[i] = new Image();
        preImage[i].src = "img/"+i+".gif";
}
timerID = 10;
startTime = 0;
flag = false;

function startSW()
{
        startTime = (new Date()).getTime();
        timerID = setTimeout('displaySW()',100);
        flag = true;
}

function displaySW()
{
        if (flag == false) return;
        theTime = Math.floor(((new Date()).getTime() - startTime));
        min = "0"+Math.floor(theTime / (60*1000));
        sec = "0"+(Math.floor(theTime / 1000) % 60);
        tim = "0"+Math.floor(theTime % 100);
        min = min.substring(min.length-2,min.length+1);
        sec = sec.substring(sec.length-2,sec.length+1);
        tim = tim.substring(tim.length-2,tim.length+1);
        m0 = min.substring(0,1);
        m1 = min.substring(1,2);
        s0 = sec.substring(0,1);
        s1 = sec.substring(1,2);
        t0 = tim.substring(0,1);
        t1 = tim.substring(1,2);
        document.M0.src="img/"+m0+".gif";
        document.M1.src="img/"+m1+".gif";
        document.S0.src="img/"+s0+".gif";
        document.S1.src="img/"+s1+".gif";
        document.T0.src="img/"+t0+".gif";
        document.T1.src="img/"+t1+".gif";
        clearTimeout(timerID);
        timerID = setTimeout('displaySW()',50);
}

function stopSW(){ flag = false; }

// -->
</SCRIPT>

■ 使い方

  1. 上のプログラムを、文章を表示したいhtmlファイルにコピーして下さい。
  2. 時計を表示したい部分に、次のように記述してください。
    ストップウォッチ
    <BR><BR>
    <IMG SRC="img/0.gif"     width="16" height="21" name="M0">
    <IMG SRC="img/0.gif"     width="16" height="21" name="M1">
    <IMG SRC="img/dot.gif"   width="9"  height="21">
    <IMG SRC="img/0.gif"     width="16" height="21" name="S0">
    <IMG SRC="img/0.gif"     width="16" height="21" name="S1">
    <IMG SRC="img/dot.gif"   width="9"  height="21">
    <IMG SRC="img/0.gif"     width="16" height="21" name="T0">
    <IMG SRC="img/0.gif"     width="16" height="21" name="T1">
    <BR><BR>
    <FORM>
    <INPUT TYPE="button" VALUE=" START " onClick="startSW()">
    <INPUT TYPE="button" VALUE=" STOP "  onClick="stopSW()">
    </FORM>
  3. <IMG SRC="___">のところに表示したい画像を入れます。
  4. 画像ファイルのダウンロード  http://www.digitmania.holowww.com/