// Please don't use anything from this scripts. It's really old, buggy and dirty as hell.
// They are made in 2000 and never really updated.
// This is more a historical document than a good example.

var Netscape = (navigator.appName == "Netscape");

function meldung(welcherText)
{ setTimeout("_meldung('" + welcherText + "')",100);}
function _meldung(welcherText)
{ window.status = welcherText
  setTimeout("_meldung('')",5000);
}

function loadCaret()
{
  start = new ebene("start");
  caret = new ebene("caret");
  caret.farbe("#666666");
  caret.sichtbar(true);
  setTimeout("flashCaret()",300);
} // end loadCaret


function flashCaret()
{
  if (caret.sichtbar()) caret.sichtbar(false);
  else caret.sichtbar(true);
  if (startTextCounter < 2) setTimeout("flashCaret()",400);
  else caret.sichtbar(true);
} // end flashCaret


function schreibeStartText()
{
  var anfang = "<span class='start'>";
  var ende = "</span>";
  var neuerText = "";
  for (i=0;i<=startTextCounter;i++)
  {
    neuerText = neuerText + startText[i] + "<br>";
  }
  start.schreibeText(anfang + neuerText + ende);

  startTextCounter++;
  if (startTextCounter == 1)
  {
    initialisierung();
    setTimeout("schreibeStartText()",warteZeit[0]);
  }
  else setTimeout("spiele_startAnimation()",warteZeit[1]);
} // end schreibeStartText


function initialisierung()
{
  var bildschirmpos = new Array(2);
  var abstandZumKreuzOben = 20;
  var abstandZumKreuzUnten = 13;
  var breiteTextFeld = 730;
  var breiteNavFeld = 120;
  var hoehe = 410;

/*   if (Netscape)
  {
    bildschirmpos[0] = window.innerWidth;
    bildschirmpos[1] = window.innerHeight;
  }
  else
  { */
    bildschirmpos[0] = window.innerWidth || document.body.offsetWidth;
    bildschirmpos[1] = window.innerHeight || document.body.offsetHeight;
//  }

  var x1 = (bildschirmpos[0]/2)-(breiteTextFeld/2)-abstandZumKreuzOben;
  var y1 = (bildschirmpos[1]/2)-(hoehe/2)-abstandZumKreuzOben;
  var x2 = (bildschirmpos[0]/2)+(breiteTextFeld/2)-abstandZumKreuzUnten;
  var y2 = (bildschirmpos[1]/2)+(hoehe/2)-abstandZumKreuzUnten;

  kreuz1 = new animationsEbene("kreuz1","position",10,spiele_startAnimation);
  kreuz1.startPos = [0,0];
  kreuz1.endePos = [x1,y1];
  kreuz2 = new animationsEbene("kreuz2","position",20,spiele_startAnimation);
  kreuz2.startPos = [x1,y1];
  kreuz2.endePos = [x2,y1];
  kreuz3 = new animationsEbene("kreuz3","position",20);
  kreuz3.startPos = [x1,y1];
  kreuz3.endePos = [x1,y2];
  kreuz4 = new animationsEbene("kreuz4","position",20);
  kreuz4.startPos = [x2,y1];
  kreuz4.endePos = [x2,y2];

  var x1Hintergrund = (bildschirmpos[0]/2)-(breiteTextFeld/2);
  var x1Nav = (bildschirmpos[0]/2)-(breiteNavFeld/2);
  var y1Felder = (bildschirmpos[1]/2)-(hoehe/2);
  var x2Hintergrund = x1Hintergrund + breiteTextFeld;
  var x2Nav = x1Nav + breiteNavFeld;
  var y2Felder = y1Felder + hoehe;
  var blaueAugenPosX1 = x1 + 276;
  var blaueAugenPosY1 = y1 + 81;
  var blaueAugenPosX2 = blaueAugenPosX1 + 475;
  var blaueAugenPosY2 = blaueAugenPosY1 + 248;

  hintergrund = new animationsEbene("hintergrund","groesse",20,spiele_startAnimation);
  hintergrund.startPos = [x1Hintergrund,y1Felder,x2Hintergrund,y1Felder];
  hintergrund.endePos = [x1Hintergrund,y1Felder,x2Hintergrund,y2Felder];
  navigation = new animationsEbene("navigation","groesse",20,spiele_startAnimation);
  navigation.startPos = [x1Nav,y1Felder,x2Nav,y1Felder];
  navigation.endePos = [x1Nav,y1Felder,x2Nav,y2Felder];
  inhaltHintergrund = new animationsEbene("inhaltHintergrund","groesse",20,inhaltHintergrundAngezeigt);
  inhaltHintergrund.startPos = [blaueAugenPosX2,blaueAugenPosY1,blaueAugenPosX2,blaueAugenPosY2];
  inhaltHintergrund.endePos = [blaueAugenPosX1,blaueAugenPosY1,blaueAugenPosX2,blaueAugenPosY2];

  inhalt = new animationsEbene("inhalt","groesse",10);
  inhalt.startPos = [blaueAugenPosX1,blaueAugenPosY1,blaueAugenPosX1,blaueAugenPosY1];
  inhalt.endePos = [blaueAugenPosX1,blaueAugenPosY1,blaueAugenPosX1+400,blaueAugenPosY2];
  inhaltSchatten = new animationsEbene("inhaltSchatten","groesse",10);
  inhaltSchatten.startPos = [blaueAugenPosX1-1,blaueAugenPosY1-1,blaueAugenPosX1-1,blaueAugenPosY1-1];
  inhaltSchatten.endePos = [blaueAugenPosX1-1,blaueAugenPosY1-1,blaueAugenPosX1+400-1,blaueAugenPosY2-1];


  // navigations-Schaltflächen laden
  galerie_n = new Image();        galerie_n.src = "nav_galerie_n.gif";
  galerie_h = new Image();        galerie_h.src = "nav_galerie_h.gif";
  bzw_n = new Image();            bzw_n.src = "nav_bzw_n.gif";
  bzw_h = new Image();            bzw_h.src = "nav_bzw_h.gif";
  musik_n = new Image();          musik_n.src = "nav_musik_n.gif";
  musik_h = new Image();          musik_h.src = "nav_musik_h.gif";
  toolbook_n = new Image();       toolbook_n.src = "nav_toolbook_n.gif";
  toolbook_h = new Image();       toolbook_h.src = "nav_toolbook_h.gif";
  persoenlich_n = new Image();    persoenlich_n.src = "nav_persoenlich_n.gif";
  persoenlich_h = new Image();    persoenlich_h.src = "nav_persoenlich_h.gif";

  // Kapitel-Überschriften links laden
  titel_galerie = new Image();      titel_galerie.src = "galerie_vertikal.gif";
  titel_bzw = new Image();          titel_bzw.src = "bzw_vertikal.gif";
  titel_musik = new Image();        titel_musik.src = "musik_vertikal.gif";
  titel_toolbook = new Image();     titel_toolbook.src = "toolbook_vertikal.gif";
  titel_persoenlich = new Image();  titel_persoenlich.src = "persoenlich_vertikal.gif";

  // Auge-Hintergrundbilder laden
  auge_galerie = new Image();       auge_galerie.src = "auge_galerie.jpg";
  auge_bzw = new Image();           auge_bzw.src = "auge_bzw.jpg";
  auge_musik = new Image();         auge_musik.src = "auge_musik.jpg";
  auge_toolbook = new Image();      auge_toolbook.src = "auge_toolbook.jpg";
  auge_persoenlich = new Image();   auge_persoenlich.src = "auge_persoenlich.jpg";

  var titelX1 = x1Hintergrund + 33;
  var titelY1 = y1Felder + 37;
  var titelX2 = titelX1 + 29;
  var titelY2 = titelY1 + 249;

  titel = new animationsEbene("titel","groesse",20);
  titel.startPos = [titelX1,titelY2,titelX2,titelY2];
  titel.endePos = [titelX1,titelY1,titelX2,titelY2];
  weiter = new animationsEbene("weiter","groesse",10);
  weiter.startPos = [x1Hintergrund+630,y1Felder+390,x1Hintergrund+630,y1Felder+420];
  weiter.endePos = [x1Hintergrund+630,y1Felder+390,x1Hintergrund+730,y1Felder+420];

  themenStart = "<table width=\"400\" height=\"248\" border=\"0\"><tr><td width=\"10\">&nbsp;</td><td valign=\"middle\"";
  themenSchrift = " class=\"schrift\">";
  themenSchriftSchatten = " class=\"schriftSchatten\">";
  themenEnde = "</td></tr></table>";
} // end initialisierung()

function spiele_startAnimation()
{
  switch (startTextCounter)
  {
    case 2:
    kreuz1.sichtbar(true);
    start.sichtbar(false);
    caret.sichtbar(false);
    kreuz1.animationStarten(20);
    break;

    case 3:
    kreuz2.animationStarten(50);
    break;

    case 4:
    kreuz3.animationStarten(50);
    kreuz4.animationStarten(50);
    setTimeout("spiele_startAnimation()",50);
    break;

    case 5:
    hintergrund.animationStarten(50);
    break;

    case 6:
    setTimeout("spiele_startAnimation()",50);
    break;

    case 7:
    navigation.animationStarten(50);
    break;

    case 8:
    for (var i = 0;i<navBilder.length;i++)
    {
      setTimeout("zeigeBild('"+navBilder[i]+"','_n')",(i+1)*warteZeit[2]);
    }
    setTimeout("spiele_startAnimation()",warteZeit[3]);
    break;

    case 9:
    if (navigation.timerIDMaus == 0 && !seiteAufgerufen) navigation.sinusSchwingungStarten();
    break;
  }
  startTextCounter++;
}

function zeigeBild(welcheEbene,bildquelle,welchesBild)
{
  if (!welchesBild) welchesBild = welcheEbene;
/*   if (Netscape)
  {
    if (dieseSeite == "start") eval("document.navigation.document."+welcheEbene+".src = "+welchesBild+bildquelle+".src");
    else
    {
      if (bilderInEbenen) eval("document."+welcheEbene+".document."+welcheEbene+".src = "+welchesBild+bildquelle+".src");
      else eval("document."+welcheEbene+".src = "+welchesBild+bildquelle+".src");
    }
  } */
//  else eval("document.all."+welcheEbene+".src = "+welchesBild+bildquelle+".src");
	var elm = document.getElementById(welcheEbene);
  if (elm)
  	elm.src = window[welchesBild+bildquelle].src;
}

function mausRein(ziel)
{
  ziel = gibDateiNameOhnePfad(ziel);
  if (dieseSeite == "start") navigation.sinusSchwingungBeenden();
  ziel = gibDateiNameOhneEndung(ziel);
  zeigeBild(ziel,"_h");
}


function mausRaus(ziel)
{
  ziel = gibDateiNameOhnePfad(ziel);
  if (dieseSeite == "start" && navigation.timerIDMaus == 0 && !seiteAufgerufen) navigation.sinusSchwingungStarten();
  ziel = gibDateiNameOhneEndung(ziel);
  zeigeBild(ziel,"_n");
}

function gibDateiNameOhnePfad(welcheDatei)
{
  return welcheDatei.substring(welcheDatei.lastIndexOf("/")+1,welcheDatei.length);
}

function gibDateiNameOhneEndung(welcheDatei)
{
  var endePos = welcheDatei.lastIndexOf(".");
  if (endePos < 0) endePos = welcheDatei.length;
  return welcheDatei.substring(welcheDatei.lastIndexOf("/")+1,endePos);
}

function seitenAufruf(welcheSeite)
{
  zielName = gibDateiNameOhnePfad(welcheSeite);
  if (!seiteAufgerufen)
  {
    if (!navigation.animationSpielt)
    {
      seiteAufgerufen = true;
      navigation.sinusSchwingungBeenden();
      navigation.animArt = "position";
      navigation.startPos = navigation.gibPosition();
      navigation.endePos = [hintergrund.endePos[0]+70,navigation.startPos[1]];
      navigation.animationBeendetFunktion = zeigeThema;
      navigation.animationBeendetParameter = zielName;
      navigation.animationStarten(50);
      weiter.animationStarten(100);
    }
  }
  else zeigeThema(zielName);
}

function zeigeThema(welchesThema)
{
  if (welchesThema == aktuellesThema) seiteLaden();
  else
  {
    aktuellesThema = welchesThema;
    titel.sichtbar(false);
    inhaltHintergrund.sichtbar(false);
    inhalt.sichtbar(false);
    inhaltSchatten.sichtbar(false);

//    if (Netscape) document.titel.document.kapitelUeberschrift.src = eval("titel_"+welchesThema+".src");
//    else document.all.kapitelUeberschrift.src = eval("titel_"+welchesThema+".src");
    document.getElementById("kapitelUeberschrift").src = eval("titel_"+welchesThema+".src");
//    if (Netscape) document.inhaltHintergrund.document.themenAuge.src = eval("auge_"+welchesThema+".src");
//    else document.all.themenAuge.src = eval("auge_"+welchesThema+".src");
    document.getElementById("themenAuge").src = eval("auge_"+welchesThema+".src");

    inhaltHintergrund.animationBeendetParameter = welchesThema;
    titel.animationStarten(30);
    inhaltHintergrund.animationStarten(50);
  }
}


function inhaltHintergrundAngezeigt(welchesThema)
{
  switch (welchesThema)
  {
    case "galerie":
    var neuerText = "Auszug meiner Computer-Kunst-Experimente.";
    break;

    case "bzw":
    var neuerText = "[bzw] - Beziehungsweise<br>Die Weise wie wir Beziehung leben.<br><br>[bzw] ist ein Farbenspiel, bei dem es um Beziehungen geht. Lassen Sie sich überraschen.<br><br>(Derzeit leider noch nicht voll<br>funktionsfähig im Netscape)";
    break;

    case "musik":
    var neuerText = "Alexa schütteln unverständlich den Kopf, Nadja brummelt irgendwas von \"Abba\" und Anja ignoriert es in tapfer, toleranter Zurückhaltung.<br><br>Hör ich nur Musik für Männer?<br>Könnte man fast meinen...<br>Hier meine ganz persönlichen Empfehlungen.";
    break;

    case "toolbook":
    var neuerText = "ToolBook ist ein Autorensystem zur einfachen Erstellung von Lernanwendungen für den Computer.<br><br>Ich will hier ein bischen Wissen weiter geben.";
    break;

    case "persoenlich":
    var neuerText = "\"Wer macht den sowas?\"<br><br>Was Sie schon immer wissen wollten...";
    break;

  }
  inhalt.schreibeText(themenStart+themenSchrift+neuerText+themenEnde);
  inhaltSchatten.schreibeText(themenStart+themenSchriftSchatten+neuerText+themenEnde);
  inhalt.animationStarten(50);
  inhaltSchatten.animationStarten(50);
}


function seiteLaden()
{
  var welcheSeite = aktuellesThema;
  if (aktuellesThema == "toolbook") var eigenschaften = "location=yes,status=yes,menubar=yes,toolbar=yes,resizable=yes";
  else var eigenschaften = "width=700,height=530,status=yes,resizable=no";
  window.open(welcheSeite+"/"+welcheSeite+".html",welcheSeite,eigenschaften);
}


// liefert eine Ganzzahl im Wertebereich von 0 bis zum übergebenen Wert
function zufall(welcheZahl)
{
  var zufallsZahl = Math.random();
  zufallsZahl = Math.round(zufallsZahl*welcheZahl);
  return zufallsZahl;
}

function gibItem(welchesItem,welcheListe,welchesTrennzeichen)
{
  if (!welchesTrennzeichen) welchesTrennzeichen = ",";
  welcheListe = welcheListe.split(welchesTrennzeichen);
  return welcheListe[welchesItem-1];
}

function istInEbene(posX,posY,welcheEbene)
{
  welcheEbene.groesseAktuallisieren();
  var x1 = welcheEbene.x
  var y1 = welcheEbene.y
  var x2 = welcheEbene.breite + x1;
  var y2 = welcheEbene.hoehe + y1;

  return (x1 <= posX && y1 <=posY && x2 >= posX && y2 >= posY);
}


//#######################
//        Objekte
//#######################

function ebene(welcheEbene)
{
  // Eigenschaften
  this.ebene = welcheEbene || "";

  if (welcheEbene)
  {
/*     if (Netscape)
    {
      this.referenz = eval("document."+welcheEbene);
      this.breite = this.referenz.clip.width;
      this.hoehe = this.referenz.clip.height;
    }
    else
    { */
//      this.referenz = eval("document.all."+welcheEbene+".style");
      this.referenz = document.getElementById(welcheEbene).style;
      this.breite = this.referenz.offsetWidth;
      this.hoehe = this.referenz.offsetHeight;
//    }
    this.x = this.referenz.left;
    this.y = this.referenz.top;
  }
  else
  {
    this.x = 0;
    this.y = 0;
  }
  this.oben = 0;
  this.rechts = 0;
  this.unten = 0;
  this.links = 0;
  this.diff = 0;

  // Methoden
  this.sichtbar = obj_sichtbar;
  this.farbe = obj_farbe;
  this.schreibeText = obj_schreibeText;
  this.gibPosition = obj_gibPosition;
  this.setzePosition = obj_setzePosition;
  this.setzeGroesse = obj_setzeGroesse;
  this.groesseAktuallisieren = obj_groesseAktuallisieren;
}

// animationsEbene ist unterobjekt von ebene

function animationsEbene(welcheEbene,animArt,schritte,animEnde,variablenName)
{
  // Eigenschaften
  this.ebene = welcheEbene || "";
  this.animArt = animArt || "";
  this.animSchritte = schritte || "";
  this.transition = "ziehen";
  this.startPos = new Array(4);
  this.endePos = new Array(4);
  this.animCounter = 0;
  this.animationSpielt = false;
  this.timerID = 0;
  this.timerIDMaus = 0;
  this.sinusZaehler = 0;
  this.animationBeendetParameter = "";
  this.objekt = variablenName || welcheEbene || "";

//  if (Netscape) this.referenz = eval("document."+welcheEbene);
//  else this.referenz = eval("document.all."+welcheEbene+".style");
  this.referenz = document.getElementById(welcheEbene).style;

  // Methoden
  this.sinusSchwingungStarten = obj_sinusSchwingungStarten;
  this.sinusSchwingung = obj_sinusSchwingung;
  this.sinusSchwingungBeenden = obj_sinusSchwingungBeenden;
  this.animationStarten = obj_animationStarten;
  this.animation = obj_animation;
  this.animationBeendetFunktion = animEnde || obj_animationBeendetFunktion;
}
animationsEbene.prototype = new ebene



function obj_animationStarten(geschwindigkeit)
{
  if (!this.animationSpielt)
  {
    window.status="";
    geschwindigkeit = geschwindigkeit || 50;
    this.animCounter = 0;
    this.animationSpielt = true;
    this.timerID = setInterval(this.objekt+".animation()",geschwindigkeit);
  }
  else window.status="Animation läuft noch...";
}



function obj_animation()
{
  this.animCounter++;
  var sX1 = this.startPos[0];
  var sY1 = this.startPos[1];
  var sX2 = this.startPos[2];
  var sY2 = this.startPos[3];
  var eX1 = this.endePos[0];
  var eY1 = this.endePos[1];
  var eX2 = this.endePos[2];
  var eY2 = this.endePos[3];
  var aS = this.animSchritte;
  var aC = this.animCounter;
  var aA = this.animArt;
  var t = this.transition;

  if (aA == "position")
  {
    var xNeu = sX1+((eX1-sX1)/aS)*aC;
    var yNeu = sY1+((eY1-sY1)/aS)*aC;
    this.setzePosition(xNeu,yNeu);
  }
  else if (aA == "groesse")
  {
    if ((t == "schieben" && sX1 <= eX1 && sY1 <= eY1) || (t == "ziehen" && sX1 <= eX1 && sY1 <= eY1))
    {
      var xNeu = sX1+((eX1-sX1)/aS)*aC;
      var yNeu = sY1+((eY1-sY1)/aS)*aC;
      var obenNeu = 0;
      var rechtsNeu = (sX2+((eX2-sX2)/aS)*aC)-sX1;
      var untenNeu = (sY2+((eY2-sY2)/aS)*aC)-sY1;
      var linksNeu = 0;
    }

    else if (t == "schieben" && sX1 >= eX1 && sY1 >= eY1)
    {
      var xNeu = eX1+((sX1-eX1)*(aS-aC)/aS);
      var yNeu = eY1+((sY1-eY1)*(aS-aC)/aS);
      var obenNeu = 0;
      var rechtsNeu = (sX2-sX1)+((sX1-eX1)*aC/aS);
      var untenNeu = (sY2-sY1)+((sY1-eY1)*aC/aS);
      var linksNeu = 0;
    }

    else if (t == "ziehen" && sX1 >= eX1 && sY1 >= eY1)
    {
      var xNeu = eX1;
      var yNeu = eY1;
      var obenNeu = (sY1-eY1)-((sY1-eY1)*aC/aS);
      var rechtsNeu = eX2-eX1;
      var untenNeu = eY2-eY1;
      var linksNeu = (sX1-eX1)-((sX1-eX1)*aC/aS);
    }
    else alert("Falsche Animation. Diese Art ist noch nicht zulässig.");
    this.setzeGroesse(xNeu,yNeu,obenNeu,rechtsNeu,untenNeu,linksNeu);
  }

  this.sichtbar(true);
  if (aC >= aS)
  {
    clearInterval(this.timerID);
    this.timerID = 0;
    this.animationSpielt = false;
    this.animationBeendetFunktion(this.animationBeendetParameter);
  }
}

function obj_animationBeendetFunktion()
{
}

function obj_gibPosition()
{
  var pos = new Array(2);
  pos[0] = parseInt(this.referenz.left);
  pos[1] = parseInt(this.referenz.top);
  return pos;
}


function obj_setzePosition(posX,posY)
{
  this.referenz.left = posX + "px";
  this.referenz.top = posY + "px";
  this.x = posX;
  this.y = posY;
}
// end obj_setzePosition()


function obj_setzeGroesse(posX,posY,posOben,posRechts,posUnten,posLinks)
{
	this.setzePosition(posX, posY);

    posUnten = posUnten + posOben;
    this.referenz.clip = "rect("+posOben+","+posRechts+","+posUnten+","+posLinks+")";
  this.oben = posOben;
  this.rechts = posRechts;
  this.unten = posUnten;
  this.links = posLinks;
}
// end obj_setzeGroesse


function obj_sichtbar(schalter)
{
  if (schalter == null)
  {
//    if (Netscape) return this.referenz.visibility == "show";
    return this.referenz.visibility == "visible";
  }
  else
  {
    schalter = (schalter) ? "visible" : "hidden";
    this.referenz.visibility = schalter;
  }
}
// end obj_sichtbar()


function obj_farbe(welcheFarbe)
{
  if (welcheFarbe == null)
  {
//    if (Netscape) return this.referenz.bgColor;
//    else this.referenz.backgroundColor;
  }
  else
  {
//    if (Netscape) this.referenz.bgColor = welcheFarbe;
    this.referenz.backgroundColor = welcheFarbe;
  }
}
// end obj_farbe()

function obj_sinusSchwingungStarten(geschwindigkeit)
{
  geschwindigkeit = geschwindigkeit || 50;
  this.timerIDMaus = setInterval(this.objekt+".sinusSchwingung()",geschwindigkeit);
}
// end obj_sinusSchwingungStarten()

function obj_sinusSchwingung()
{
  var sinWert = Math.sin(this.sinusZaehler*(Math.PI/180));
  if (this.sinusZaehler >= 360) this.sinusZaehler = 0;
  this.sinusZaehler += 2;
  this.referenz.left = this.x+(sinWert*50);
}
// end obj_sinusSchwingung()


function obj_sinusSchwingungBeenden()
{
  clearInterval(this.timerIDMaus);
  this.timerIDMaus = 0;
}
// end obj_sinusSchwingungBeenden()


function obj_schreibeText(welcherText)
{
  welcherText = welcherText.replace(/~/g,"<br>");
/*   if (Netscape)
  {
    this.referenz.document.open();
    this.referenz.document.write(welcherText);
    this.referenz.document.close();
  }
  else
  { */
 	document.getElementById(this.ebene).innerHTML = welcherText;
//  }
  this.groesseAktuallisieren();
}
// end obj_schreibeText()

function obj_groesseAktuallisieren()
{
/*   if (Netscape)
  {
    this.referenz.clip.top = 0;
    this.referenz.clip.left = 0;
    this.breite = this.referenz.document.width;
    this.hoehe = this.referenz.document.height;
    this.referenz.clip.width = this.breite;
    this.referenz.clip.height = this.hoehe;
  }
  else
  { */
    this.referenz.clip = "rect(0,auto,auto,0)";
//    this.breite = eval("document.all." + this.ebene + ".offsetWidth");
//    this.hoehe = eval("document.all." + this.ebene + ".offsetHeight");
    this.breite = document.getElementById(this.ebene).offsetWidth;
    this.hoehe = document.getElementById(this.ebene).offsetHeight;
//  }
}
