Jquery изменяет размер прослушивателя на div

Это ситуация, у меня есть 2 div рядом друг с другом. Один div очень динамичен по высоте, что в основном означает, что он может расти и сокращаться, чтобы разместить его. Например, у этого div есть содержимое, которое можно складывать открытым или закрытым, или контейнеры, которые могут расширяться, чтобы соответствовать загруженному содержимому ajax.

Теперь рядом с этим div будет еще один, который аккуратно следует за высотой первого с помощью css. Прекрасно работает. Но вот вопрос: я хотел бы изменить содержимое этого второго div в зависимости от его высоты.

Другими словами, div 1 изменяется в размере, div 2 следует через css, и теперь мне нужно вызвать вызов ajax для повторного заполнения div 2 новым контентом, подходящим для него новым размером.

Кто-нибудь знает, как я могу это сделать с помощью jquery? Если возможно, без использования тайм-аутов?

Приветствия.

ОТВЕТЫ

Ответ 1

Как предоставленный поток poelinca предлагает, для этой функции есть несколько плагинов.

Если вам не нравится идея плагина, другим простым решением было бы просто инициировать событие "изменить размер" в div при каждом изменении содержимого. Затем вы можете контролировать его с помощью resize(), как и ожидалось, используя элегантный шаблон наблюдателя.

function appendContent($div, content) {
   $div.append(content).trigger($.Event('resize'));
}

$div.bind('resize', function(e) {
   // all your magic resize mojo goes here
});

Ответ 3

Единственное, о чем я мог подумать, - это установить таймер на каждую высоту каждые X секунды.

Что-то вроде этого:

function checkHeightTimer(){
    var div1 = $('#div1');
    var div2 = $('#div2');
    var somesize = #somenumber here;
    if(div1.height() > somesize){
        //do something to div2
    }
    setTimeout(checkHeightTimer, 500); //at 500 miliseconds
}