Анимировать строки таблицы, чтобы скользить или исчезать?

Question

я наткнулся на этот плагин

https://jquery-datatables-row-grouping.googlecode.com/svn/trunk/customization.html

проблема, все в <tr> с, и я боюсь, что вы не можете оживить их?

Действительно ли нет? CSS или javascript.

например. Я хочу анимировать таблицы tr элементов.

Answer 1

Возможно одно решение может быть такое:

var animate = function(evt) { 
 
    //we go to the 'tr' tag 
 
    $el = $(evt.currentTarget).parent().parent(); 
 
    
 
    //we hide the 'td's tag 
 
    $el.find('td').hide(333 , function(){ 
 
    // we reduce the height of 'tr' tag 
 
    $el.animate({height : 0} , 777) 
 
    }); 
 
    
 

 
} 
 
$('button').click(animate);

table { 
 
    border: solid 1px #AAA; 
 
    padding: 3px; 
 
    border-collapse: separate; 
 
} 
 
td { 
 
    height: 50px; 
 
    margin : 3px; 
 
    min-width : 50px; 
 
    border: solid 1px orange; 
 
} 
 
tr { 
 
    height : 55px; 
 
    padding : 12px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>a</td><td>b</td><td><button>hide</button></td> 
 
    </tr> 
 
    <tr> 
 
    <td>a</td><td>b</td><td><button>hide</button></td> 
 
    </tr> 
 
    <tr> 
 
    <td>a</td><td>b</td><td><button>hide</button></td> 
 
    </tr> 
 
</table>