Marcel: Uhrzeit aktuallisierung ( automatisch) im bestimmten Feld

Beitrag lesen

Hallo.
ich habe folgende Aufgabe bekommen:
4.4 Mausverfolgung
Erschaffe ein Feld, das die aktuelle Uhrzeit (bei einstelligen Minuten/Stunden mit führender
Null) beinhaltet und dem Mauszeiger über den Bildschirm folgt.
Zusatz:
1. Die Uhrzeit soll sich selbständig aktualisieren.
2. Das Feld in dem die Uhrzeit ist, folgt der Maus mit einiger Verzögerung.
3. Definiere in der Mitte des Bildschirms ein 500x500 Pixel großes Feld in dem die Uhrzeit
dem Mauszeiger folgt. Verlässt der Mauszeiger diesen Bereich, soll das Feld der
Uhrzeit wieder zur Mitte laufen.
4. Teile die Uhrzeit in 2 Objekte, wovon eines die Stunden beinhaltet und das andere die MInuten und Sekunden.

ich hab jetzt das problemn ,dass sich die Uhrzeit nur dann aktuallieiert, wenn ich auch die Maus in dem 500px x 500px feld bewegen .
wie mach ich, dass die zeit sich grundsätzlich automatisch aktuallisiert??

Hier das, was ich geschrieben hab:

Vorab viele Dank fürs Helfen.
Gruß marcel

<html>
<head>
<title>Aufgabe 4.2.4</title>
<style type="text/css">
body { background-color:#FF9999;
          text:#000000;
}
a:link { color:white }
a:visited { color:blue }
a:hover { color:yellow }
a:active { color:lime }

	#footer		{ position:absolute;  
		          bottom:20;  
				}  

</style>
<script type="text/javascript">

function bla()  
	{  
	document.onmousemove = asd;  
	}  
function asd()  
	{  
	var Jetzt = new Date();  
	var stunden = Jetzt.getHours();  
	var minuten = Jetzt.getMinutes();  
	var sekunden = Jetzt.getSeconds();  
	var vorsek = ( sekunden < 10 ) ? "0" : "";  
	var vormin = ( minuten < 10 ) ? "0" : "";  
	var vorstd = ( stunden < 10 ) ? "0" : "";  
	var std = vorstd + stunden + ":" ;  
	var min = vormin + minuten + ":";  
	var sek = vorsek + sekunden + " Uhr";  
	var Zeit = std  
	var Zeit1 = min + sek  
	  
	document.getElementById("objekt1").innerHTML = Zeit  
	document.getElementById("objekt1").style.left  = window.event.clientX +15+"px";  
	document.getElementById("objekt1").style.top = window.event.clientY +15+ "px";  
	document.getElementById("objekt2").innerHTML = Zeit1  
	document.getElementById("objekt2").style.left  = window.event.clientX +35+"px";  
	document.getElementById("objekt2").style.top = window.event.clientY +15+ "px";  
	}  
	  
	function weg()  
	{  
	document.onmousemove = fgh;  
	}  

	function fgh()  
	{  
	var text2 = "";  
  
	document.getElementById("objekt1").innerHTML = text2  
	document.getElementById("objekt1").style.left  = window.event.clientX +15+"px";  
	document.getElementById("objekt1").style.top = window.event.clientY +15+ "px";  
	document.getElementById("objekt2").innerHTML = text2  
	document.getElementById("objekt2").style.left  = window.event.clientX +35+"px";  
	document.getElementById("objekt2").style.top = window.event.clientY +35+ "px";		  
	}  

</script>
</head>
<body>
<form name="Formular" action="">

<div id="Rahmen" style="position:absolute; left:25%; top:20%; width:500px; height:500px; border-width:1px;
          border-color:black; border-style:solid; background-color:#FFFFFF" align= "center"
          onmousemove="bla()"
          onmouseout="weg()"
  >
<br><center>Hier mit der Maus rein und eine Uhr erscheint</center>
</div>
<div id="objekt1" style="position:absolute; left:330px; top:330px; width:10px; height:10px; border-width:0px;
          border-color:black; border-style:solid; background-color:none" align="center"></div>
<div id="objekt2" style="position:absolute; left:350px; top:330px; width:65px; height:10px; border-width:0px;
          border-color:black; border-style:solid; background-color:none" align="center"></div>

<center><br><h1><u>Mausverfolgung</u></h1>
Hier seht ihr eine Mauszeigerverrfolgung</center>

<a id="footer" href="../HTML/Startseite.html" target="Daten"><b>zur Startseite<br></b></a><br>
</form>
</body>
</html>