jQuery zmiana rozmiaru słuchacza na div

Question

Jest to sytuacja, mam 2 div jest obok siebie. Jeden element div ma bardzo dynamiczną wysokość, co oznacza, że ​​może on rosnąć i zmniejszać się w celu dostosowania do jego zawartości. Na przykład ten element div ma zawartość, którą można złożyć lub zamknąć, lub pojemniki, które można rozwinąć w celu dopasowania do załadowanej zawartości ajax.

Teraz obok tego div jest inny, który ładnie podąża za wysokością pierwszego przez css. Działa świetnie. Ale tutaj jest pytanie: chciałbym zmienić zawartość tego drugiego diva w zależności od jego wysokości.

Innymi słowy, div 1 zmiany rozmiaru, div 2 następuje poprzez css i muszę teraz wywołać wywołanie ajax, aby ponownie wypełnić div 2 nową treścią, nadając jej nowy rozmiar.

Ma ktoś pomysł, jak mogę to zrobić z jquery? Jeśli to możliwe, bez korzystania z limitów czasu?

Pozdrawiam.

Answer 1

Jak the thread poelinca provided sugeruje, istnieje kilka ciekawych wtyczek dostępnych do tej funkcji.

Jeśli nie podoba Ci się pomysł wtyczki, kolejnym prostym rozwiązaniem byłoby po prostu wywołanie zdarzenia "zmień rozmiar" w dziale, gdy zawartość zostanie zmodyfikowana. Następnie możesz go monitorować za pomocą funkcji resize() zgodnie z oczekiwaniami, wykorzystując elegancki model observer pattern.

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

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

Answer 2

Jedyne co mogłem wymyślić to posiadanie zegara sprawdzającego wysokość co każde X sekund.

coś takiego:

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 
} 

Answer 3

https://github.com/sdecima/javascript-detect-element-resize

działa jak marzenie!

Ive testowany attrchange ale to nie działa, stracił 2 godziny pracy :(