views:

244

answers:

0

Hi All!

I am writing a script using jQuery and Flickr REST API.

Now the problem statement:

following the the pseudo algo

  • hit Flickr API and get a list of photos using $.getJSON nad create li list elements

    create_gallery: function(){
        $.getJSON(
            $.prep_api_url(),
            function(data){
                $.each(data.photos.photo, function(i,item){
                    var photo_raw_url = 
                        'http://farm' + item.farm + '.static.flickr.com/' + 
                        item.server + '/' + item.id + '_' + item.secret;
                    var photo_url = photo_raw_url + '_b.jpg';
                    $('<li><a id="' + item.id + '" class="image_trigger" href=' + 
                       photo_url + '><img class="thumbnails" src=' + photo_raw_url + 
                       '_s.jpg' + ' width=22 hight=22 /><a/></li>').appendTo('.image_thumbs');
                });
                $('.thumbnails').css({'opacity' : '.6'});
            }
        );
    },
    
  • preload all the images by refferring created list (I have Problems Here)

  • on click of every image display the image from preloaded array

Now I want this

1) get the JSON object from Flickr
2) create the list and append it to DOM
3) after successfull insertion, run through all images from list and preload them sequentially one by one.

I am trying hard to get this, had no success. I have also tried async option, nothing happend

please help m out