nicht angemeldet
[und DHTML] Fehlerhaftes verhalten
Hallo zusammen,
ich generiere eine Tabelle, bei welcher einige Zeilen mittels style="display:none;" versteckt sind. Per Klick auf ein Image koennen dann diese Zeilen durch den User ein- bzw. wieder ausgeblendet werden. Funktioniert WUNDERBAR.
Problem ist nur, das der IE, wenn man eine Weile mit der Seite "rumgespielt" hat (also ein paar Mal die versteckten Zeilen ein- bzw. ausgeblendet hat), Probleme bei der Darstellung hat.
Dieses sieht dann bei mir wie folgt aus:
Der HTML-Code ist laut "http://validator.w3.org/" sauber, genauso wie das CSS. Ich nutze den IE-Browser in der Version "6.0.2800.xxxxx". FireFox hat keine Probleme damit.
Hätte jemand eine Ahnung, woran das liegt? Durch Probieren hab ich rausgefunden, daß das Problem -nicht- auftritt, wenn man
"border-collapse:collapse;"
ODER "<colgroup> ... </colgroup>"
entfernt, aber ich würde beides gerne drin lassen wollen ("collapse" weil wegen Layout und "colgroup" weil wegen Breitendefinition der Spalten [ist im Bsp-Code nicht enthalten])
Gruß
rig
<!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=ISO-8859-1">
<title>Was ist hier falsch?</title>
<script type="text/javascript">
function __f(_id) {
var trObj = document.getElementById('img_' + _id);
var w_displayProp = '';
if(trObj.src.indexOf("down.gif") > 0) {
trObj.src = "http://de.selfhtml.org/src/next.gif";
w_displayProp = '';
} else {
trObj.src = "http://de.selfhtml.org/src/down.gif";
w_displayProp = 'none'
}
for(var i = 1; ; i++) {
var childObj = document.getElementById(_id + i);
if (childObj == null)
break;
childObj.style.display = w_displayProp;
}
}
</script>
<style type="text/css">
th {
border-style: ridge;
border-width: 2px;
padding:5px 10px;
text-align:center;
}
td {
border-style: ridge;
border-width: 2px;
padding:5px;
}
table {
border-width:0px;
border-collapse:collapse;
}
</style>
</head>
<body>
<table>
<colgroup>
<col>
<col>
</colgroup>
<tr>
<th>Teilnehmer</th>
<th>Beschreibung</th>
</tr>
<!-- 1. Zeile -->
<tr id="x1">
<td><img alt="[x]" id="img_x1" onclick="__f('x1');" src="http://de.selfhtml.org/src/down.gif" />Markus Mustermann</td>
<td> </td>
</tr>
<tr id="x11" style="display:none;">
<td colspan="2">ein<br />test</td>
</tr>
<!-- 2. Zeile -->
<tr id="x2">
<td><img alt="[x]" id="img_x2" onclick="__f('x2');" src="http://de.selfhtml.org/src/down.gif" />Maria Mustermann</td>
<td> </td>
</tr>
<tr id="x21" style="display:none;">
<td colspan="2">ein<br />test</td>
</tr>
<!-- 3. Zeile -->
<tr id="x3">
<td><img alt="[x]" id="img_x3" onclick="__f('x3');" src="http://de.selfhtml.org/src/down.gif" />Maik Mustermann</td>
<td> </td>
</tr>
<tr id="x31" style="display:none;">
<td colspan="2">ein<br />test</td>
</tr>
<!-- 4. Zeile -->
<tr id="x4">
<td><img alt="[x]" id="img_x4" onclick="__f('x4');" src="http://de.selfhtml.org/src/down.gif" />Martha Mustermann</td>
<td> </td>
</tr>
<tr id="x41" style="display:none;">
<td colspan="2">ein<br />test</td>
</tr>
</table>
</body>
</html>
-
Hallo,
ich generiere eine Tabelle, bei welcher einige Zeilen mittels style="display:none;" versteckt sind. Per Klick auf ein Image koennen dann diese Zeilen durch den User ein- bzw. wieder ausgeblendet werden. Funktioniert WUNDERBAR.
Problem ist nur, das der IE, wenn man eine Weile mit der Seite "rumgespielt" hat (also ein paar Mal die versteckten Zeilen ein- bzw. ausgeblendet hat), Probleme bei der Darstellung hat.Dieses sieht dann bei mir wie folgt aus:
Setze, wenn Du das TR-Element ausblendest, auch die borderWidth aller TD-Elemente in diesem TR-Element auf 0. Beim Einblenden setze sie dann auf "".
viele Grüße
Axel
-
Setze, wenn Du das TR-Element ausblendest, auch die borderWidth aller
TD-Elemente in diesem TR-Element auf 0. Beim Einblenden setze sie dann auf "".Danke für den Tipp - klappt SUPER
Gruß
rig
-