テーブル内のjQuery slideDownとSlideUpが正しく表示されない

Question

テーブルで使用するとき、jQuery slideUpとslideDownに軽微な問題があります。 slideUpとslideDownは、テーブル要素では動作しませんので、私は、

.main-table { 
    border-radius: 0.5em 0.5em 0 0; 
    width: 129em; 
    background-color: #f1f1f1;  
    margin-top: 1.5em; 
    z-index: 10; 
    position: relative; 
} 

.main-table td, .main-table th { 
    padding: 1.2em 0.7em; 
    border-collapse: collapse; 
    border-left: 0.1em solid #dedede; 
} 

.main-table td:first-child, .main-table th:first-child { 
    border-left: 0 solid; 
} 

.expandable-container td { 
    padding: 0 !important; 
    background-color: red; /* inserted to identify the problem */ 
} 

：外部表のための

<tr class="expandable-container"> 
    <td colspan="10"> 
    <div id="3_expandable" style="display: none;"> 
     <table class="innerTable"> 
     ... 
     </table> 
    </div> 
    </td> 
</tr> 

スタイル：私はこの（また、主にjQueryのによって生成されたが、それは重要ではありません）のようなHTMLを持っています私のコンテンツ（別のテーブルですが、それは重要ではありません）をラップして、div内に隠してありますが、これはもちろん隠されています。 slideUpとslideDownメソッドを適用してFirefox 6でテストしたところ、何らかの理由でアニメーションがスキップしていました。だから私はそれを調べるために10秒間のスライド時間を設定し、アニメーションが始まると、td要素は高さ== 20pxで直ちに表示され、divはその中をスライドします。その後、すべてが期待どおりに進みます - divがtdの予期しない高さを超えると、divはそれをカバーし、意図されたサイズに展開されます。

これはFirefox 6で発生します。Chrome 13では問題なく動作します。IEのバージョンではテストされませんでした。これは意図されたブラウザではないため、すべての問題を解決する必要はありませんでしたそれをLinuxマシンにインストールしてください。 Operaではまだテストされていません。これは修正される予定の他のスクリプトがクラッシュするためです。

スライドショーアニメーションの最初の瞬間のスクリーンショットを貼り付けています - tdがどこからも外に出ている（赤い背景）。

私の質問 - それを修正する方法や回避策はありますか？

アリエルが提案したように、私はjsFiddleとして追加しました。奇妙なことに、それはFF6でもうまく動作します： jsFiddle rendition

EDIT：私はOpera 11でクラッシュの原因となった問題を修正したので、テストできました。だから、オペラ11でも起こります。

Answer 1

フィドルに基づいて、あなたの症状はパディングやマージン（おそらくマージン）と関係していると思います。すなわち、要素が見えるとすぐに、高さアニメーションに含まれていないマージンを有する。

しかし、私はそれが起こっているのを見ていないので、私は本当に答えることはできません。 （おそらくあなたの実際のコードとフィドルの違いを理解しようとするべきです - CSSのセクションをコメントアウトしてみてください）