![]() |
<!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">(Internet Explorer)</FONT></B> <BR><BR><BR> <DIV ID="eyes" STYLE="position:relative; width:240px; height:160px"> <IMG SRC="images/eyes.gif" WIDTH=240 HEIGHT=160> <SPAN ID="eyeball0" STYLE="position:absolute; width:19px; height:25px; left:81px; top:68px"> <IMG SRC="images/eyeball.gif" WIDTH=19 HEIGHT=25> </SPAN> <SPAN ID="eyeball1" STYLE="position:absolute; width:19px; height:25px; left:141px; top:68px"> <IMG SRC="images/eyeball.gif" WIDTH=19 HEIGHT=25> </SPAN> </DIV> </CENTER> <SCRIPT LANGUAGE="JavaScript1.2" TYPE="text/javascript"> <!-- function move() { // 目玉の縦横比は 4:3 var dx = (event.clientX + document.body.scrollLeft - (document.getElementById("eyes").offsetLeft + 60)) * 4; var dy = (event.clientY + document.body.scrollTop - (document.getElementById("eyes").offsetTop + 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; with(document.getElementById("eyeball" + String(i)).style) { left = String(51 + dx2) + "px"; top = String(68 + dy2) + "px"; } dx -= 480; } } document.onmousemove = move; //--> </SCRIPT> </BODY> </HTML> |