Datatables show/hide row with jquery UI effect

Question

I'm using Datatables 1.10, jQuery and jQuery UI. In datatables I have nested tables with a show/hide ability for child tables, and I'm trying to make a show/hide animation with jQuery blind. Here is the code I'm using now, but the effect isn't working.

 projectsTable.on('click', 'td.details-control', function (event) {
    event.stopPropagation();
    var tr = $(this).closest('tr');
    var row = projectsTable.row( tr );

    if ( row.child.isShown() ) {
        // This row is already open - close it
        row.child.hide('blind',{},1000);
        tr.removeClass('shown');
        delete showHideItems['p'+row.data().id]
        ganttChart.hideKids('p'+row.data().id, gantt)
    }
    else {
        // Open this row  

        row.child.show('blind',{},1000);
        tr.addClass('shown');
        showHideItems['p'+row.data().id] = true
        ganttChart.showKids('p'+row.data().id, gantt)
    }

} );

edit

Here is link to a jsfiddle http://jsfiddle.net/n8d6su8m/5/

It's a bit of a large example, but I wanted to include more code so we could find the exact problem. Interesting code is in the javascript starting on line 284 and for the second type of tables starting at line 578. Show and hide should be executed after clicking red + buttons in first column.