Добавление анимации в ajax

Question

Я написал код, в котором .getJSON API из jquery используется для получения изображений из публичного API Flickr. Пожалуйста, смотрите эту ссылку . Я сделал каждое из изображений скользящим после того, как каждый запрос закончен. Теперь я хочу, чтобы первый набор изображений скользил вниз, а затем следующие наборы сначала двигались вверх, а затем заменялись изображениями из запроса ajax, сохраняя ту же анимацию, что и для первого набора изображений. Я думаю, что очень мало модификаций достаточно. Я благодарю вас за ваш комментарий и предложение, прежде чем вручить.

Answer 1

Является ли этим , что вы имели в виду?

getFlickr();
setInterval(getFlickr, 20000);

function getFlickr() {
    $.getJSON('http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?', {
        'format': 'json'
    }, function(data) {
        if ($('p').length < 1) {
            addPiecePiece('#main',true,null);
        }
        else {
            $('.flickr').each(function(i) {
                $(this).delay(4000*i).slideUp(2000,function(){
                      addPiecePiece($(this),false,i);
                      $(this).remove();
                });
            });


        }

        function addPiecePiece(element,aoa,index) {
            $.each(data.items, function(key, value) {
                if(index == null || index == key){
                   title = value.title;
                   description = value.description;
                   photo = value.media.m;
                   html = $('<p class="flickr"></p>').html(description).css({
                       'display': 'none'
                   });

                   if(aoa == true){
                    $(html).appendTo(element).slideDown(2000);   
                   }else{
                    $(html).insertAfter(element).slideDown(2000);   
                   }
                }

            });
        }

    })
}