Gleich hohe DIV Container

Aus Contao Community Documentation

Version vom 24. Mai 2012, 09:33 Uhr von KATgirl (Diskussion | Beiträge)

(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Um ein dreispaltiges Layout mit drei gleich hohen DIV-Container zu erzeugen ist es Möglich dieses per JS zu machen.

Wenn man z.B. eine solche Struktur hat:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf8">
<title></title>
 
</head>
<body>
 
<div id="wrapper">
        <div id="container">
                <div id="left"> </div>
 
                <div id="main"> </div>
 
                <div id="right"> </div>
 
                <div class="clear"></div>
        </div>
</div>
 
</body>
</html>

Kann man mit folgendem Code im Seitenlayouts (eigner JS-Code)

<script type="text/javascript">
 
 	var HeightContainer  = $('container').getSize().y; 
 
 	if ($('left')) { $('left').height(HeightContainer); }
 	if ($('main')) { $('main').height(HeightContainer); }
 	if ($('right')) { $('right').height(HeightContainer); }
 
</script>

Die Höhe aller DIVs an die Höhe des umschließenden DIVs Container anpassen.

ACHTUNG: Mootools muss aktive sein.

Ansichten
Meine Werkzeuge

Contao Community Documentation

Chuck Norris programmiert kein PHP, er diktiert das Ergebnis. Den Rest macht der Editor aus Angst.

Stefan Lindecke
Navigation
Verstehen
Verwenden
Entwickeln
Verschiedenes
Werkzeuge