Анимация для вставки через append()

178

09 июля 2018, 12:20

По клику на кнопку из БД подгружаю через ajax по несколько блоков $('#works').append(data); Подскажите, если ли адекватный вариант как-то анимировать эту вставку типа slideDown() jquery Структура блоков

    <div id="works">
        <div class="work"> content </div>
        <div class="work"> content </div>
        <div class="work"> content </div>
        <div class="work"> content </div>
    </div>

$('body').on('click','#load-more-events', function(e){ 
    e.preventDefault(); 
    var category_id = $('#s02 .tabs li .active').attr('data-id'); // если посты уже отфильтрованы, то в кнопку для загрузки следующей страницы 
    var page = $(this).attr('data-page'); // номер страницы для загрузки 
    var button = $(this).parents('.shadowBtn'); 
    $.ajax({ 
        type: "POST", 
        url: window.wp_data.ajax_url, 
        data : { 
            action : 'get_projects', 
            category_id : category_id, 
            paged : page 
        }, 
        success: function (data) { 
            button.remove(); //удаляем кнопку 
            $('#works').append(data); // добавляем в контейнер ответ с сервера 
            $( "#s02 #works .button" ).insertAfter( "#s02 #works"); 
			checkWorkCategoryName(); 
        } 
    }); 
});