✔ div über gesamte Seite

[clipper]

wenn du ein DIV über die ganze seite gehen lassen willst, darfst du nicht nach dem BODY ein DIV aufmachen und sofort wieder schließen!
mach mal das /DIV vor das /BODY.

 

[Microhome]

Hi clipper,
gute Idee, nur sehe ich dann den Inhalt der "Hauptseite" nicht mehr
Kann ich das vielleicht irgendwie über JavaScript und ScrollHeight machen? Ich meine irgendwie muss es doch möglich sein, ein div über die gesamte Seite (auch außerhalb des "Sichtbereiches") zu packen?!


Vielen Dank und beste Grüße.

 

[Maik]

Lösungsvorschlag:

#box{
    background-color: #000;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 5;
    width: 100%;
    height: 100%;
}

Falls du hierbei den IE6 berücksichtigen möchtest, der diesen position-Wert nicht unterstützt, empfehle ich dir http://code.google.com/p/ie7-js/ -> http://ie7-js.googlecode.com/svn/test/fixed.html

mfg Maik

 

[Quaese]

Hi,

eine Lösung mit JavaScript ist möglich.

Du musst zunächst das passende body-Objekt ermitteln. Von diesem ausgehend, kannst du nun die passenden Eigenschaften zum Ermitteln der Dokumenten-Dimensionen aufrufen.

Beispiel:

document.observe("dom:loaded", function() {
  $('box').setStyle({
    height: getDimensions().dim_y + "px"
  });
});

function getDimensions(){
  var intAbsX = intAbsY = 0;
  var objBody = null;

  // Passendes Body-Objekt ermitteln
  if(document.all && !window.opera)
    objBody =(window.document.compatMode == "CSS1Compat")? window.document.documentElement : window.document.body || null;
  else if(document.all && window.opera)
  	objBody = document.body;
  else
    objBody = document.documentElement;

  if(window.innerHeight && window.scrollMaxY){
    intAbsX = window.innerWidth + window.scrollMaxX;
    intAbsY = window.innerHeight + window.scrollMaxY;
  // Alle ausser Explorer Mac
  }else if(objBody.scrollHeight >= objBody.offsetHeight){
    intAbsX = objBody.scrollWidth;
    intAbsY = objBody.scrollHeight;
  // Explorer Mac, IE6 Strict, Mozilla, Safari
  }else{
    intAbsX = objBody.offsetWidth;
    intAbsY = objBody.offsetHeight;
  }

  return {dim_x: intAbsX, dim_y: intAbsY};
}

Vielleicht hilft dir das weiter.

Ciao
Quaese

 

[Microhome]

Super, ganz lieben Dank für eure Hilfe! Ich werde die Variante von Maik benutzen, da sie schlichtweg kürzer ist. Echt prima, funktioniert. Danke nochmal!


Liebe Grüße.