Question

I use the function below to show a list of items. I want to change the function so that I can display the navigation when the pseudo recussion is finished. Is there a way to dtect when it is finished?

function fadeItem() {
    $('ul li:hidden:first').fadeIn(fadeItem);
}

Answer 1

(update: added this first part) Loads all embed images then recursively fades everything in every half second, then does an alert (replace with the concept you commented back on)

var selector = "ul li:hidden:first";
function fadeIn($item) {
   $item.fadeIn(500,function() {
      var n = $(selector);
      if(n.length > 0) {
         fadeIn($(selector));
      } else {
         // add a div
         alert("added a div");
      }

   })
}

$(document).ready(function() {
   // load images first
   var imgs = []; // cached
   $("ul li img").each(function() {
      // create a separate img tag because img is not active due do [assumed css] display:none;
      var cacheImage = document.createElement('img');
      cacheImage.src = $(this).attr("src");
      imgs.push(cacheImage);
   });
   // this is a quick method, you can change window to the image nodes to optimize better
   $(window).load(function() {
      fadeIn($(selector));
   });
});

Source: http://jsfiddle.net/MattLo/ukLaG/1/ (using a very large image to test)