ブートストラップの崩壊が滑りません

Question

ブートストラップのcollapseに問題があります。 閉じる/折りたたみアニメーションがないことを除いて、これは必要なように機能します。

スライディングアウトはうまく機能し、滑らかですが、スライドインは、表示される要素でhide（）を使用するのと同じように動作します。

何が原因だろうと思いますか？

唯一の変更は、あなたのコードを実行可能にするために、およびネストされたA.に

編集をTRエルからのデータトグルを変更することでした

<tr class="cursor-pointer" data-target="#accordion65" data-toggle="collapse" aria-expanded="true"> 
... 
</tr> 
<tr> 
    <td class="clear-p-b-m" colspan="7"> 
     <div class="collapse in" id="accordion65" aria-expanded="true" style=""> 
     <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 task-details" 
     ... 
     </div> 
     <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> 
     ... 
     </div> 
     </div> 
    </td> 
</tr> 

Answer 1

：私は、ネストされたAを削除したが、それは余計でした - TRはこのコンテキストでクリックを受け入れることができます。問題は、テーブルの幅が決まっていなかったことです。スニペットがうまくいかないと言ったらどういう意味なのか分かりません。また、折りたたまれたエルを折りたたんで開始し、クリックして表示するように変更しました。それはあなたが崩壊しているTRではなく、入れ子にされたdivなので、折りたたまれても2番目のtrが表示されることに注意してください。崩壊がトリガされたどのよう

table { 
 
    width: 100%; 
 
} 
 

 
tr { 
 
    border-bottom: 1px dotted black; 
 
} 
 

 
tr:hover { 
 
    background-color: #eee; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script> 
 
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css" rel="stylesheet" /> 
 
<table> 
 
    <tr class="cursor-pointer" data-target="#accordion65" data-toggle="collapse" aria-expanded="true"> 
 
    <td> 
 
     click me 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td class=" clear-p-b-m" colspan="7"> 
 
     <div class="collapse out" id="accordion65" aria-expanded="true" style=""> 
 
     <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12 task-details"> 
 
      zoop 
 
     </div> 
 
     <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> 
 
      ... 
 
     </div> 
 
     </div> 
 
    </td> 
 
    </tr> 
 
</table>