Как проверить высоту div, чтобы переставить блоки div

Question

Я использую jQuery Masonry на своем сайте для отображения сообщений в блоге.И в каждом блоке постов есть поле для комментариев Facebook.Когда появляется новый комментарий, контейнерный блок расширяется и, к сожалению, перекрывается с нижним.В этом случае мне нужно повторно запустить скрипт Masonry для перезагрузки блоков.

Поэтому я использую Плагин Jquery Resize Event Бена Алмана , чтобы проверить изменение высоты элемента div, чтобы скрипт Masonry переставил блок в соответствии с его новым размером иизбегает перекрытий.

Хотя это не работает и, кажется, не возникает ошибок, когда я проверяю его с помощью firebug.Я новичок в Jquery, и я надеюсь, что я просто делаю здесь простую ошибку.

Если вы хотите взглянуть на это, пожалуйста, проверьте bjk-tribun.com Вы увидитеперекрытия при вводе некоторых комментариев в поле для комментариев.

$(function(){
  // Bind the resize event. When any test element's size changes, update its
  // corresponding info div.
  var iframe = $(".fb_iframe_widget");

  // Called once the Iframe's content is loaded.
  iframe.load(function(){
    // The Iframe's child page BODY element.
    var iframe_content = iframe.contents().find('body');

    // Bind the resize event. When the iframe's size changes, update its height as
    // well as the corresponding info div.
    iframe_content.resize(function(){
      var elem = $(this);

      // Resize the IFrame.
      iframe.css({ height: elem.outerHeight( true ) });

      $('#sort').masonry(reloadItems);

    // Resize the Iframe and update the info div immediately.
    iframe_content.resize();
  });
});

Answer 1

Хорошо, я не знаю, почему, но как только я включил colorbox.js, который был плагином лайтбокса, плагин Jquery Masonry начал реагировать на div resize. Поэтому, если кто-то сталкивается с той же проблемой, он должен сначала попытаться отключить другие плагины jquery, чтобы не тратить на это целую неделю.

Я также отключил плагин Бена Алмана, который вставил выше. Масонства достаточно для обработки события изменения размера.

Answer 2

В зависимости от того, какую версию jQuery вы используете, вам может потребоваться добавить единицу px в свойстве css:

iframe.css({ height: elem.outerHeight( true ) + "px" });