
	function korrektur(Objekt) {
	  if(parseInt(Objekt.css("left")) < 100) {
	    Objekt.css("left","10px");
	  }
	  else if(parseInt(Objekt.css("left")) > 900) {
	    Objekt.css("left","900px");
	  }
	  if(parseInt(Objekt.css("top")) < 100) {
	    Objekt.css("top","100px");
	  }
	  else if(parseInt(Objekt.css("top")) > 400) {
	    Objekt.css("top","450px");
	  }
	}
	
	$(document).ready(function(){
	  $("#flaeche1").draggable({
	    stop: function(event,ui) {
	      korrektur($("#flaeche1"));
	    }
	  });
	 });
	 
	$(document).ready(function(){
	  $("#flaeche2").draggable({
	    stop: function(event,ui) {
	      korrektur($("#flaeche2"));
	    }
	  });
	 });

	$(document).ready(function(){
	  $("#flaeche3").draggable({
	    stop: function(event,ui) {
	      korrektur($("#flaeche3"));
	    }
	  });
	 });

	$(document).ready(function(){
	  $("#flaeche4").draggable({
	    stop: function(event,ui) {
	      korrektur($("#flaeche4"));
	    }
	  });
	 });



	 
	// Globale Variablen
	// um das Interval ordentlich stoppen zu können
    var aktiv1 = "";
	var aktiv2 = "";
	var aktiv3 = "";
	var aktiv4 = "";
	
	// um die Bewegungsrichtung zu  speichern
    var horizontal = new Array("-","+");
    var vertikal = new Array("-","+");
 
     function _bewegen(id,ndx) {
	  // die aktuellen Werte holen
      var Element  = document.getElementById(id);
      var wertleft = parseInt(Element.style.left);
      var werttop  = parseInt(Element.style.top);
         
	  // Bewegungsumfang festlegen
      if(horizontal[ndx] == "-") {
        if((ndx%2) == 0) x = -4;
	    else x = -2;
      }
      else {
	    if((ndx%2) == 0) x = +4;
		else x = +2;
      }
      if(vertikal[ndx] == "-") {
        y = -1;
      }
      else {
		if((ndx%2) == 0) y = +9;
        else y = +7;
      }
          
      // Bewegung durchführen  
      Element.style.left = (wertleft+x) + "px";
      Element.style.top  = (werttop+y)  + "px";

	  // oberer Rand erreicht???
      if(vertikal[ndx] == "-" && werttop < 100) {
		Element.style.top = 100;
        vertikal[ndx] = "+";
      }
	  // unterer Rand erreicht???
	  // 400 = Höhe der Spielfläche - Höhe des Spielobjektes
      else if(vertikal[ndx] == "+" && werttop > 400) {
		 Element.style.top = 400;
         vertikal[ndx] = "-";
      }
        
	  // linker Rand erreicht???
      if(horizontal[ndx] == "-" && wertleft < 10) {
		Element.style.left = 10;
        horizontal[ndx] = "+";
      }
	  // rechter Rand erreicht???
	  // 700 = Breite der Spielfläche - Breite des Spielobjektes
      else if(horizontal[ndx] == "+" && wertleft > 900) {
		Element.style.left = 900;
        horizontal[ndx] = "-";
      }}
	
	  
    function starten() {
	  window.clearInterval(aktiv1);
	  window.clearInterval(aktiv2);
	  window.clearInterval(aktiv3);
	  window.clearInterval(aktiv4);
      aktiv1 = window.setInterval("_bewegen('flaeche1',0)", 35);
	  aktiv2 = window.setInterval("_bewegen('flaeche2',1)", 10);
	  aktiv3 = window.setInterval("_bewegen('flaeche3',0)", 7);
	  aktiv4 = window.setInterval("_bewegen('flaeche4',1)", 20);
    }