Toggle innerhalb <table><tr>

GN911

Erfahrenes Mitglied
Hallo,

ich habe 2 Probleme.
Und zwar habe ich eine Tabelle mit 10 Spalten und möchte nun eine Zeile bei Bedarf einblenden. Leider wird dies im FF und Safari nicht korrekt angezeigt, im IE7 dagegen schon.
Zusätzlich möchte ich, wenn die zusätzliche Ebene eingeblendet ist, dass ein anderer Button erscheint.
Das ganze ist mit jQuery.

Code:
<script type="text/javascript">
<!--
 $(document).ready(function()
 {
     // Ebene ein- und ausblenden
     $(".slidePanel").click(function()
     {
         $("#tradePanel").slideToggle("slow");
         
         // Button tauschen, wenn Handeln aktive ist
         $("#tradeButton").click(function()
         {
             $("#tradeButton").attr("src", "../images/handeln_active.gif");
         });
     });
 });
-->
</script>
HTML:
<td><a href="#" class="slidePanel"><img id="tradeButton" src="images/handeln.gif" width="24" height="24" alt="handeln" /></a> <img src="images/watchlist.gif" width="24" height="24" alt="watchlist" /></td>
                        </tr>
                        
                        <!-- zus&auml;tzliche Orderoptionen einblenden -->
                        <tr id="tradePanel">
                          <td colspan="10">Hier werden zus&auml;tzliche Orderoptionen eingeblendt.</td>
                        </tr>
Wenn unter Xetra auf das "H" drückt soll dies passieren.
http://www.ofmf.de/DEMO/

GN911
 
Moin,

ich nehme mal an, jquery wird da beim togglen die display-Eigenschaft auf "block" setzen....allerdings ist <tr> kein Blockelement, was Darstellungsprobleme verursacht.

Lösung:
Anstatt die <tr> zu sliden, packe in die zugehörige Zelle ein <div> und slide dieses.
 

Neue Beiträge

Zurück