マテリアルCSSテーブルアコーディオン

Question

マテリアルCSSを使用してテーブルにアコーディオンエフェクトを作成しようとしています。彼らはcollapsibleクラスを持っています。しかし、それをテーブルで使用しても、私に望ましい影響は与えていません。コード：（CODEPEN）

<table> 
     <thead> 
      <tr> 
       <th data-field="id">Name</th> 
       <th data-field="name">Item Name</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
      <td> 
      <p class="table-metric-color">Alex</p> 
      </td> 
      <td> 
      <ul class="collapsible" data-collapsible="accordion"> 
       <li> 
       <a href="#" class="collapsible-header">Details</a> 
       <p class="collapsible-body white"><code> Details here</code></p> 
       </li> 
      </ul> 
      </td> 
     </tr> 
     </tbody> 
     </table> 

私は、ブートストラップCSSを使用して得たthisのようなもの、を目指しています。材料CSSを使用してこれを複製する方法はありますか？

Answer 1

あなたは最初のjqueryのを含めると、次のように折りたためるを初期化する必要があります。

$(document).ready(function(){ 
    $('.collapsible').collapsible(); 
    }); 

http://codepen.io/anon/pen/XNmMLL?editors=1111