smooth.htm

戻る

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML LANG="ja">

<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=Shift_JIS">
<TITLE>なめらかに回るカウンタ</TITLE>
</HEAD>

<BODY BGCOLOR="#CCFFFF" onLoad="setTimeout(timer, 50)">
<CENTER>
<BR><BR>
<B><FONT SIZE="+1" COLOR="#CC0000">なめらかに回るカウンタ</FONT></B>
<BR><BR><BR>

<DIV STYLE="position:relative; width:132px; height:31px">
<IMG SRC="images/cntr_t.gif" WIDTH=132 HEIGHT=3 STYLE="position:absolute; width:132px; height:3px; left:0; top:0">
<IMG SRC="images/cntr_l.gif" WIDTH=3 HEIGHT=25 STYLE="position:absolute; width:3px; height:25px; left:0; top:3px">
<IMG SRC="images/cntr_r.gif" WIDTH=3 HEIGHT=25 STYLE="position:absolute; width:3px; height:25px; left:129px; top:3px">
<IMG SRC="images/cntr_b.gif" WIDTH=132 HEIGHT=3 STYLE="position:absolute; width:132px; height:3px; left:0; top:28px">
<SPAN STYLE="position:absolute; width:21px; height:25px; left:3px; top:3px; overflow:hidden">
<IMG ID="digit16" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit26" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
<SPAN STYLE="position:absolute; width:21px; height:25px; left:24px; top:3px; overflow:hidden">
<IMG ID="digit15" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit25" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
<SPAN STYLE="position:absolute; width:21px; height:25px; left:45px; top:3px; overflow:hidden">
<IMG ID="digit14" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit24" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
<SPAN STYLE="position:absolute; width:21px; height:25px; left:66px; top:3px; overflow:hidden">
<IMG ID="digit13" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit23" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
<SPAN STYLE="position:absolute; width:21px; height:25px; left:87px; top:3px; overflow:hidden">
<IMG ID="digit12" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit22" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
<SPAN STYLE="position:absolute; width:21px; height:25px; left:108px; top:3px; overflow:hidden">
<IMG ID="digit11" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
<IMG ID="digit21" SRC="images/digit_0.gif" WIDTH=21 HEIGHT=25 STYLE="position:absolute; width:21px; height:25px; left:0; top:0">
</SPAN>
</DIV>

</CENTER>

<SCRIPT LANGUAGE="JavaScript1.2" TYPE="text/javascript">
<!--

function timer() {
  if(off == 0) {
    var w = cnt = (cnt + 1) % 1000000;
    for(n = 1; ; n++) {
      document.getElementById("digit2" + String(n)).src = imgs[w % 10].src;
      if(w % 10 != 0)
        break;
      if(n == 6)
        break;
      w = Math.floor(w / 10);
    }
  }
  off++;
  var i;
  for(i = 1; i <= n; i++) {
    if(topnum) {
      document.getElementById("digit1" + String(i)).style.top = - off;
      document.getElementById("digit2" + String(i)).style.top = 25 - off;
    }
    else {
      document.getElementById("digit1" + String(i)).style.top = String(- off) + "px";
      document.getElementById("digit2" + String(i)).style.top = String(25 - off) + "px";
    }
  }

  if(off == 25)
    setTimeout(timer2, 0);
  else
    setTimeout(timer, 50);
}

function timer2() {
  for(; n; n--) {
    var obj1 = document.getElementById("digit1" + String(n));
    var obj2 = document.getElementById("digit2" + String(n));
    obj1.src = obj2.src;
    if(topnum) {
      obj1.style.top = 0;
      obj2.style.top = 25;
    }
    else {
      obj1.style.top = "0";
      obj2.style.top = "25px";
    }
  }
  off = 0;

  setTimeout(timer, 50);
}

  imgs = new Array();
  for(i = 0; i < 10; i++) {
    imgs[i] = new Image(21, 25);
    imgs[i].src = "images/digit_" + String(i) + ".gif";
  }

  topnum = (typeof(document.getElementById("digit11").style.top) == "number");

  for(i = 1; i <= 6; i++)  // Opera 対策
    document.getElementById("digit2" + String(i)).style.top = (topnum) ? 25 : "25px";

  cnt = 0;
  n = 0;
  off = 0;

//-->
</SCRIPT>

</BODY>

</HTML>