将动画添加到ajax中

时间:2011-12-28 23:24:38

标签: json jquery animation

我编写了代码,其中来自jquery的.getJSON api用于从flickr public api中获取图像。请参阅此link。每个请求完成后,我都会让每个图像都滑动。现在,我希望第一组图像向下滑动,然后跟随集合首先向上滑动,然后用来自ajax请求的图像替换,保持与第一组图像相同的动画。我认为一点修改就足够了。我事先感谢你的意见和建议。

1 个答案:

答案 0 :(得分:1)

this你的想法是什么?

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);   
                   }
                }

            });
        }

    })
}