views:

206

answers:

1

Hi all, This is an example of code I have created to explain the situation. It works well but when it toggle to hide the tbody, it does a estrange effect (first expands the tbody by three or four times more than it is and then it collapses straigh away, and when it slide down it will also do it straigh away).

When slide down it is not a problem for me, but when collapses it is.

Could you give a hand on this?

Thanks

Code.

<html>
<head>
<script type="text/javascript">
        $(function() {
        $(".tblGeneral thead").click(function() {
        $(this).next(".tblGeneral tbody").slideToggle("fast");
        });
        });
      </script>
</head>
<body>
 <table class="tblGeneral">
      <thead>
          <tr>
            <td colspan="2">Title</td>
         </tr>
    </thead>
     <tbody>
        <tr>
            <td class="title">Name:</td>
            <td>Some name</td>
       </tr>
    </tbody>
</table>
</body>
+1  A: 

Hey, you want to apply the css

position: relative; 

to your table, that should fix the issue.

so in your case, it would be

.tblGeneral { position: relative; }
DrexiL