window.onresize style ändern

Thomasio

Erfahrenes Mitglied
Keine Ahnung, ob das jetzt mehr zu CSS oder zu JavaScript gehört, vermutlich beides, denn ich versuche krampfhaft JavaScript mit CSS zu mixen.
Insbesondere will ich auf Änderungen in der Grösse des Browserfensters reagieren können.

Gefunden habe ich http://de.selfhtml.org/javascript/beispiele/fensterueberwachen.htm
Das habe ich mir so weit angepasst, dass ich bei Änderungen der Fenstergrösse einen alert() bekomme.

Code:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<title>Meine Webseite</title>
<script type="text/javascript">
function Fensterweite () {
  if (window.innerWidth) {
    return window.innerWidth;
  } else if (document.body && document.body.offsetWidth) {
    return document.body.offsetWidth;
  } else {
    return 0;
  }
}

function Fensterhoehe () {
  if (window.innerHeight) {
    return window.innerHeight;
  } else if (document.body && document.body.offsetHeight) {
    return document.body.offsetHeight;
  } else {
    return 0;
  }
}

function neuAufbau () {
  if (Weite != Fensterweite() || Hoehe != Fensterhoehe())
    alert('Groesse wurde geaendert');
}

/* Überwachung von Netscape initialisieren */
if (!window.Weite && window.innerWidth) {
  window.onresize = neuAufbau;
  Weite = Fensterweite();
  Hoehe = Fensterhoehe();
}
</script>
</head>
<body>
<script type="text/javascript">
/* Überwachung von Internet Explorer initialisieren */
if (!window.Weite && document.body && document.body.offsetWidth) {
  window.onresize = neuAufbau;
  Weite = Fensterweite();
  Hoehe = Fensterhoehe();
}
</script>
<div id="MeinContainer">

... 

hier steht
ein Haufen
Zeug

...

</div>
</body></html>

Was ich jetzt machen will, ist bei oder anstatt alert() im <body> die Eigenschaften von MeinContainer ändern.
Keine Ahnung wie die Syntax lauten müsste, probiert habe ich einiges, aber ohne Erfolg.
Darum mal frei Schnauze ohne Code-TAGs was ich machen will, ich denke es wird schon klar, was das werden soll.

if ( Fensterhoehe() < 300 )
{
MeinContainer.style.position = "absolute";
}
else
{
MeinContainer.style.position = "fixed";
MeinContainer.style.top = "10px";
MeinContainer.style.left = "10px";
}
}

Ist jemand so nett und gibt mir die richtige Syntax.
 
Zurück