✔ <tr> Ein- und Ausblenden klappt nicht da "keine properties"

[warcraft9105]

Hallo,
versuche schon es seit zwei Stunden hinzubekommen.
Erst mal der Code:

Damit mache ich meine Tabelle und fülle sie mit Daten aus meiner Datenbank:

.
.
.

$i = 1;
            $result = mysql_query($query_msg);
            while($msg = mysql_fetch_object($result))
            {
                $i++;
                $result2 = mysql_query("select ID from user where Name = '" . $msg->Absender . "';");
                while($id = mysql_fetch_object($result2))
                    $absender_id = $id->ID;
                echo "<div class=\"show_msg\">
                                <table cellspacing='0' border='0'>
                                    <tr>
                                        <th><a style=\"color:black;\" href='./?cmc=user&id=" . $absender_id . "&na=" . $msg->Absender . "&msg=" . $_REQUEST['msg'] . "'>" . $msg->Absender . "</a></th>
                                        <td> schrieb am " . $msg->Datum . " um " . $msg->Zeit . " Uhr</td>
                                        <td style='text-align:right; color:#DDDDDD;'><img name='bild\'" . $i . "\'' src='./pics/zeichen/show_text.gif' onclick='show_text(" . $i . "); return false;'></td>
                                    </tr>
                                    <tr name='\'" . $i . "\'' style='display:none;'>
                                        <td colspan=\"2\">" . $msg->Text . "</td>
                                    </tr>
                                </table>
                            </div>";
            }
.
.
.

Und hier mein Javascript, das aber irgendwie nicht geht:

function show_text (name){

    var bild = 'bild' + name;
    if (document.getElementsByName(name).style.display == "none") 
    {
            document.getElementsByName(name).style.display = "inline";
            document.getElementsByName(bild).src = "./pics/zeichen/hide_text.gif";
    }
    else 
    {
            document.getElementsByName(name).style.display = "none";
            document.getElementsByName(bild).src = "./pics/zeichen/show_text.gif";
    }
}

So: Ich habe das Add-on Firebug für meinen FF und der sagt mir immer wenn ich auf das Bild klicke:document.getElementsByName(name).style has no properties

Kann mir jemand sagen was falsch ist

 

[Maik]

Hi,

versuch es mal mit der getElementById()-Methode:

function show_text (id){

    var bild = 'bild' + id;
    if (document.getElementById(id).style.display == "none")
    {
            document.getElementById(id).style.display = "inline";
            document.getElementById(bild).src = "./pics/zeichen/hide_text.gif";
    }
    else
    {
            document.getElementById(id).style.display = "none";
            document.getElementById(bild).src = "./pics/zeichen/show_text.gif";
    }
}

<div class="show_msg">
                                <table cellspacing='0' border='0'>
                                    <tr>
                                        <th><a style="color:black;" href="#">absender</a></th>
                                        <td> schrieb am " . $msg->Datum . " um " . $msg->Zeit . " Uhr</td>
                                        <td style='text-align:right; color:#DDDDDD;'><img id='bildtest' src='./pics/zeichen/show_text.gif' onclick='show_text("test"); return false;'></td>
                                    </tr>
                                    <tr id='test' style='display:none;'>
                                        <td colspan="2">" . $msg->Text . "</td>
                                    </tr>
                                </table>
                            </div>

 

[warcraft9105]

Ok, jetzt zeigt er es mir an und blendet es wieder aus aber jedes mal wenn ich es wieder aufmache wird dieser Bereich in dem es eingeblendet wird größer. Liegt warscheinlich am "inline" oder Was soll ich sonst verwenden

 

[Maik]

In dieser Zeile einfach keinen Eigenschaftswert angeben

function show_text (id){

    var bild = 'bild' + id;
    if (document.getElementById(id).style.display == "none")
    {
            document.getElementById(id).style.display = "";
            document.getElementById(bild).src = "./pics/zeichen/hide_text.gif";
    }
    else
    {
            document.getElementById(id).style.display = "none";
            document.getElementById(bild).src = "./pics/zeichen/show_text.gif";
    }
}

 

[warcraft9105]

Danke jetzt gehts perfekt. Wie würde ich das denn in der CSS-Datei schreiben? Also display = "" geht ja nicht. Macht zwar keinen Sinn aber egal. Danke nochmal

 

[Maik]

Verstehe die Frage jetzt nicht. Und nein, ich bin noch nicht zu müde

Was willst du denn mit der JS-Codezeile im Stylesheet?

 

[Quaese]

Hi,

in deinem Fall würde sich der Wert table-row für die display-Eigenschaft in der CSS-Definition anbieten.

display: table-row;

Leider wird dieser erst vom IE ab Version 8 unterstützt.

Ciao
Quaese

 

[Maik]

Hi,

Leider wird dieser erst vom IE ab Version 7 unterstützt.

du sprichst dann wohl konkret vom IE8, denn der IE7 unterstützt wie seine Vorgänger die Tabellenwerte zur display-Eigenschaft nicht - siehe http://www.quirksmode.org/css/display.html

 

[Paspirgilis]

Für IE würd ich die tr vorher als Objekte machen dann gehts auch da und btw., machst mal erledigt wenns erledigt is.

 

[Quaese]

Hi,

selbstverständlich habe ich den IE 8 gemeint - habs ausgebessert.

Danke Maik!

Ciao
Quaese