Web-Augen: Javascript und DHTML

// *******************************************************************
// Dieses Script basiert auf dem Watching Eyes Script von Virtual_Max.
// PC-ONLiNE hat es optimiert und einen kleinen Bug beseitigt.
// SWANJA hat das Script aktualisiert und für Netscape 6.0 und OPERA lauffähig gemacht. 
// Das Original finden Sie im Web unter http://www.geocities.com/siliconvalley/lakes/8620.
// Der dargestellte QuellCode entspricht dem Orginal v. PC-OneLine.
// Die Anpassungen an Netscape 6 und Opera sind hier (noch) nicht berücksichtigt.
// *******************************************************************
var Ver4=parseInt(navigator.appVersion.charAt(0))>=4
var IE=navigator.appName.indexOf("Microsoft")!=-1
var ex=0, ey=0, x0=-80, y0=-40, au, lp, rp

function BewegeAugen()
{ // Neue Position des Augenpaares berechnen und setzen
  if (Math.abs(ex-x0)>=10)
  { x0+=Math.floor((ex-x0)*0.1) }
  else
    if (ex!=x0)
    { x0+=Math.abs(ex-x0)/(ex-x0) }
  if (Math.abs(ey-y0)>=10)
  { y0+=Math.floor((ey-y0)*0.1) }
  else
    if (ey!=y0)
    { y0+=Math.abs(ey-y0)/(ey-y0) }
  au.left=x0-43
  au.top=y0-42
  BewegePupillen()
  setTimeout("BewegeAugen();",100)
}

function BewegePupillen()
{ // Neue Position der Pupillen berechnen und setzen
  dy=ey-y0+22
  dx1=ex-x0+23
  dx2=dx1-40
  r=Math.sqrt(dx1*dx1+dy*dy)
  if (r<20) r=20
  lp.left=dx1*10/r+x0-33
  lp.top=dy*10/r+y0-32
  r=Math.sqrt(dx2*dx2+dy*dy)
  if(r<20) r=20
  rp.left=dx2*10/r+x0+7
  rp.top=lp.top
}

function MeinMausEvent(e)
{ // Position des Maus-Cursors ermitteln
  if (Ver4)
  { if (!IE)
    { ex=e.pageX
      ey=e.pageY }
    else
    { ex=event.clientX + document.body.scrollLeft
      ey=event.clientY + document.body.scrollTop }
    BewegePupillen()
  }
}

function ScriptSetup()
{ // Globale Variablen setzen und Maus-Event initialisieren
  if (Ver4)
  { if (!IE)
    { au=document.augen
      lp=document.lpup
      rp=document.rpup
      document.captureEvents(Event.MOUSEMOVE)
    }
    else
    { au=document.all.augen.style
      lp=document.all.lpup.style
      rp=document.all.rpup.style
    }
    document.onmousemove = MeinMausEvent
    BewegeAugen()
  }
}

function Copyright()
{ window.focus()
  alert("Web-Augen by Stefan Kuhn") }

function ZeigeAugen()
{ // Setzen der Block-Level Container zur Anzeige der Grafiken
  if(Ver4)
  { s ='<DIV STYLE="visibility:hidden"></DIV>'
    s+='<DIV ID="augen" STYLE="position:absolute; '
    s+='top:-40; left:-80; width:80; height:40">'
    s+='<A HREF="javascript:Copyright();">'
    s+='<IMG SRC="augen.gif" border=0></A></DIV>'
    s+='<DIV ID="lpup" STYLE="position:absolute; '
    s+='top:-30; left:-70; width:20; height:20">'
    s+='<A HREF="javascript:Copyright();">'
    s+='<IMG SRC="pupille.gif" border=0></A></DIV>'
    s+='<DIV ID="rpup" STYLE="position:absolute; '
    s+='top:-30; left:-30; width:20; height:20">'
    s+='<A HREF="javascript:Copyright();">'
    s+='<IMG SRC="pupille.gif" border=0></A></DIV>'
    document.writeln(s)
  }
}

window.onload = ScriptSetup;
ZeigeAugen()

Der Script-Aufruf im Kopf der HTML-Seite "augen.htm"

<HTML>

<HEAD>
  <TITLE>PC-ONLiNE Web-Augen 2</TITLE>
  <SCRIPT LANGUAGE="javascript1.2" SRC="augen.js"></SCRIPT>
</HEAD>

<BODY>


...


</BODY>
</HTML>