|
 |
  |
| Autor |
Nachricht |
umt
Beliebter [User]
Anmeldung: 29.11.07
Beiträge: 310
|
 Verfasst am: 10.02.2008, 18:16 Titel: Probleme mit Javascript bei IE6 und IE7 |
 |
|
Also ich habe folgendes Javascript um die Höhe der div-Container einander anzugleichen:
| Code: |
function correct_layout() {
if(document.getElementById('content').offsetHeight) {
var div_heights = new Array(
document.getElementById('content').offsetHeight,
document.getElementById('navigation').offsetHeight,
document.getElementById('features').offsetHeight
);
div_heights = div_heights.reverse(div_heights.sort(num_sort));
if(div_heights[0] < 500) div_heights[0] = 500;
var style_height = div_heights[0] + "px";
document.getElementById('navigation').style.height = style_height;
document.getElementById('content').style.height = div_heights[0] - 20 +"px";
document.getElementById('features').style.height = div_heights[0] - 10 +"px";
document.getElementById('container').style.height = div_heights[0] + 156 +"px";
}
}
function num_sort(a,b) {
return a-b;
}
|
das Script wird so aufgerufen:
| Code: |
<body onload="correct_layout()">
|
Mit FF und Opera funktioniert das wunderbar.
IE6 und IE7 zeigen aber nur einen leeren Screen in der Hintergrundfarbe an.
Hier ist die Seite:
[url]
 http://www.netzonaut.de/netztest/index.php
[/url]
Kann mir jemand sagen, woran das liegen könnte und wie ich die IEs dazu bringe, die Seite anzuzeigen?
_________________
www.jexlab.net - Webentwicklung zu fairen Konditionen
www.netzonaut.de - Blog zum Thema Webentwicklung, Internet, Linux und OpenSource-Software
|
|
| Nach oben |
|
 |
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1624
|
| Verfasst am: 11.02.2008, 09:58 Titel: |
|
|
Du willst also, dass alle drei Spalten deines Layouts bündig abschließen, sehe ich das richtig?
Wenn ja, würde ich dir nahelegen dabei nicht auf ein Javascript zu verlassen, ohne sieht's nämlich nicht so prickelnd aus.
Deine Seite hat eine fixe Breite, wie auch die einzelnen Blöcke Navigation und Features.
Dann gibt es eine relativ einfache Methode, das ganze via CSS zu lösen (um nicht auf Tabellen zurückgreifen zu müssen)!
Du kannst nämlich einfach einem container-Div mit Breite 800px eine Hintergrundgrafik geben, die wie folgt aufgebaut ist:
Gesamtbreite: 800px;
Höhe: beliebig, ich nehm' mal 1px;
Die ersten 160px färbst du in der Hintergrundfarbe deiner Navigation, danach weiß, die letzten 160px in der Hintergrundfarbe des Features-Block.
In diesem container-div floatest du dann die Navi links (mit width: 160px), und Features rechts. Der Inhalt kommt danach und wird nicht gefloatet, bekommt nur ein margin-left und -right von 160 px (Damit der Text nicht im Navi bzw. Features Block steht, wenn diese bereits "zu ende" sind.
Das ganze funktioniert dann schonmal immer, wenn der Content höher ist, als Navi und Features. Für den Fall, dass dem nicht so ist, erzwingst du das ganze, in dem du nach dem Content-div noch ein div mit der eigenschaft clear: both; einfügst (Ich meine mich erinnern zu können, dass ihm auch eine Höhe gegeben werden musste, sonst hat's irgendwo nicht geklappt).
Dann hast du das ganze ohne auf Javaskript angewiesen zu sein. Auch wenn's jetzt wohl nochmal ein bisschen Arbeit ist, das umzustellen 
Schönen Gruß,
Chris
_________________
Mancher ertrinkt lieber,
als daß er um Hilfe ruft.
(Wilhelm Busch)
|
|
| Nach oben |
|
|
umt
Beliebter [User]
Anmeldung: 29.11.07
Beiträge: 310
|
| Verfasst am: 11.02.2008, 13:05 Titel: |
|
|
Danke für den Tipp!
Das ist natürlich auch eine gute Idee.
So werd ich das mal basteln.
_________________
www.jexlab.net - Webentwicklung zu fairen Konditionen
www.netzonaut.de - Blog zum Thema Webentwicklung, Internet, Linux und OpenSource-Software
|
|
| Nach oben |
|
|
|
|
  |
|
Alle Zeiten sind GMT + 1 Stunde
|
| Seite 1 von 1 |
|  |
