Анимации Jquery не сглаживаются после загрузки данных через ajax

Question

У меня есть пара ссылок в раскрывающемся меню, извлекающих некоторые фоновые изображения (и некоторые другие данные) через ajax. Затем предполагается, что это меню возвращает анимацию обратно в исходное положение ОДНАЖДЫ данные полностью загружены (благодаря fold_menu ()). К сожалению, анимация не совсем гладкая (даже когда изображения находятся в кеше, но когда содержимое уже показано).

Я пробовал много разных способов проверить, загружается ли изображение перед запускомfold_menu (). Я попытался передать его в качестве аргумента для populate () и даже просто запустить его внутри вызывающего fetch_Data (), но безуспешно ..

function fetch_Data(arg1, arg2) {

  $.ajax({
  type: "GET",
  dataType: "json",
  url: "fetch.php",
  data: 'arg1=' + arg1+ '&arg2=' + arg2,
  success:function(data)
    {
        populate_html(data)
    }
  });

}

...

function populate_html(data) {

  var loaded = 0;

  $.each(data, function(key, value) { 

    //populating html with data

    slide_content.hide(); 
    $('<img/>').attr('src', 'imgs/' + photo_name + '.jpg').on('load', function() {
    $(this).remove();
    slide_content.css('background-image', 'url("imgs/' + photo_name + '.jpg")').fadeIn(2000); 

    loaded++

      // I have 3 images to load
      if (loaded === 3) {
      fold_menu();
      }

    });

});
}

В случае, если вам нужно взглянуть на fold_menu ():

function fold_menu() {  

  $('.menu').css("height", "...px");    
  $('.title').css("height", "...px"); 

  //more stuff

}

fold_menu (), кажется, запускается после полной загрузки данных, но анимация все еще не выглядит гладкой. Любая идея? Спасибо