[Meister Lampe]

Hallo,

ich habe inzwischen schon diverse threads hier durchgelesen aber leider keine Lösung für mich entdecken können.

Mein Ziel:
tbody per Klick auf den thead ausblenden und nicht per Klick auf das Bild (rechts im thead)

Meine bisherigen Versuche an einer eigenen Tabelle die auf einer eigene Seite (angelegt mit Page Manager on Querschlaeger):

PHP-Code:

<table class="tborder" cellspacing="1" cellpadding="4" border="0" style="margin-top: 5px;">
    <thead>
      <tr>
        <td class="thead" colspan="2">
            <div class="expcolimage"><img src="{$theme[\'imgdir\']}/wcfan_portal/collapse.png" id="cat_q3_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
            <div><strong><a href="css" class="fname" id="q3">{$lang->q3}</a></strong><div class="smalltext_forum"></div></div>
        </td>
    </tr>
    </thead>
    <tbody style="display: none;{$expdisplay}" id="cat_q3_e">
      <tr>
        <td class="trow2 post_content">
            {$lang->a3}
        </td>
      </tr>
    </tbody>  
</table> 


Funktioniert mit der Standardmethode wunderbar, der Tabellenkörper wird ausgeblendet. (blauer Pfeil mit 1.)

Nun möchte ich nicht auf das Bild klicken müssen, sondern auf den Tabellenkopf klicken können um den Körper zu verstecken. (roter Pfeil mit 2.)

Ich habe schon versucht die Tabelle so anzupassen:

PHP-Code:

<table class="tborder" cellspacing="1" cellpadding="4" border="0" style="margin-top: 5px;">
    <thead id="cat_q3_img" class="expander">// HIER DIE AENDERUNG!
      <tr>
        <td class="thead" colspan="2">
            <div class="expcolimage"><img src="{$theme[\'imgdir\']}/wcfan_portal/collapse.png" alt="{$expaltext}" title="{$expaltext}" /></div>
            <div><strong><a href="css" class="fname" id="q3">{$lang->q3}</a></strong><div class="smalltext_forum"></div></div>
        </td>
    </tr>
    </thead>
    <tbody style="display: none;{$expdisplay}" id="cat_q3_e">
      <tr>
        <td class="trow2 post_content">
            {$lang->a3}
        </td>
      </tr>
    </tbody>  
</table> 


und den entsprechenden Eintrag in der general.js zu:

Code:

expanders = $$('thead.expander');

zu ändern, allerdings hilft das nicht. Der Courser wird zwar im gewünschten Bereich zum Pointer aber ausklappen lässt sich der Tabellenkörper nicht.

Da ich in Sachen JavaScript nicht der hellste bin, liegt meine Vermutung nahe, dass ich eine Anpassung vergessen habe. Kann mir da vllt jemand weiterhelfen?

Forum: <LINK>
PS: aktuelle Problemseite (FAQ) für Gäste nicht sichtbar, da noch in Entwicklung.