Выравнивание высот с помощью JQuery после события

Question

Я разрабатываю сайт, который анализирует RSS-каналы и отображает их в виде серии div. После загрузки всех загрузок я хотел бы запустить функцию jquery, которая в основном занимает высоту самого высокого div и устанавливает все divs, равные этой высоте. Вы можете просматривать сайт здесь: http://vitaminjdesign.com/adrian/

В настоящее время я с помощью JQuery equal heights plugin, описанной ниже:

function equalHeight(group) { 
    var tallest = 0; 
    group.each(function() { 
     var thisHeight = $(this).height(); 
     if(thisHeight > tallest) { 
      tallest = thisHeight; 
     } 
    }); 
    group.height(tallest); 
} 

и вы можете назвать его:

$(document).ready(function() { 
$(".block").equalHeights(); 
}); 

Это не работает должным образом (он устанавливает высоту всех divs, равных высоте самого высокого div ПЕРЕД НАЗНАЧЕНИЕМ rss-загрузки), скорее всего, из-за того, что мне нужно использовать обработчик событий в реальном времени? Кто-нибудь знает, как я могу установить высоту равным после того, как все будет полностью загружено?

Answer 1

После завершения работы AJAX необходимо позвонить по телефону equalHeight. У вас есть два варианта: (a) выполнить вызов после загрузки каждого элемента или (b) выполнить вызов один раз после загрузки всех элементов. equalHeight не выглядит ресурсоемким, поэтому вы также можете делать вызов каждый раз.

Так что просто добавьте equalHeight($(".block")); в обратный вызов success каждого вызова AJAX.

$.ajax({ 
    url: 'someurl.rss', 
    success: function(){ 
     // your code to insert the relevant content 

     equalHeight($(".block")); // insert this at the end of each call to the RSS files 
    } 
}); 

---

В качестве альтернативы, и немного более интенсивным, но проще с точки зрения кода, заключается в использовании ajaxSuccess запустить функцию после каждого AJAX вызова:

$(document).ajaxSuccess(function(){ 
    equalHeight($(".block")); 
});