ソースの表示

■ xeyes_n4.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>xeyes もどき</TITLE>
</HEAD>

<BODY BGCOLOR="#CCFFFF">
<CENTER>
<BR><BR>
<B><FONT SIZE="+1" COLOR="#CC0000">xeyes もどき</FONT><BR><FONT COLOR="#CC0000">（Netscape 4）</FONT></B>
<BR><BR><BR>

<TABLE><TR><TD>
<ILAYER NAME="eyes" WIDTH=240 HEIGHT=160>
<IMG NAME="eyes_img" SRC="images/eyes.gif" WIDTH=240 HEIGHT=160>
<LAYER WIDTH=19 HEIGHT=25 LEFT=81 TOP=68>
<IMG SRC="images/eyeball.gif" WIDTH=19 HEIGHT=25>
</LAYER>
<LAYER WIDTH=19 HEIGHT=25 LEFT=141 TOP=68>
<IMG SRC="images/eyeball.gif" WIDTH=19 HEIGHT=25>
</LAYER>
</ILAYER>
</TD></TR></TABLE>

</CENTER>

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

function move(e) {
  // 目玉の縦横比は 4:3
  var dx = (e.pageX - (document.eyes.document.eyes_img.x + 60)) * 4;
  var dy = (e.pageY - (document.eyes.document.eyes_img.y + 80)) * 3;
  var i;
  for(i = 0; i < 2; i++) {
    var d = dx * dx + dy * dy;
    var dx2, dy2;
    if(d > 14400) {  // マウスは目玉の外
      d = Math.sqrt(d);
      dx2 = dx * 120 / d;
      dy2 = dy * 120 / d;
    }
    else {
      dx2 = dx;
      dy2 = dy;
    }
    dx2 = Math.floor(Math.abs(dx2) / 4 + 0.5);
    if(dx < 0)
      dx2 = - dx2;
    dy2 = Math.floor(Math.abs(dy2) / 3 + 0.5);
    if(dy < 0)
      dy2 = - dy2;
    if(i)  // 左目
      dx2 += 120;
    document.eyes.document.layers[i].moveTo(51 + dx2, 68 + dy2);
    dx -= 480;
  }
}

  captureEvents(Event.MOUSEMOVE);
  onmousemove = move;

//-->
</SCRIPT>

</BODY>

</HTML>