jquery ridimensionare l'ascoltatore su un div

Question

Questa è la situazione, ho 2 div uno vicino all'altro. Un div è molto dinamico in altezza, il che significa fondamentalmente che può crescere e restringersi per adattarsi al suo contenuto. Ad esempio, questo div ha contenuti che possono essere piegati aperti o chiusi o contenitori che possono espandersi per adattarsi al contenuto caricato di ajax.

Ora, accanto a questo div è un altro che segue perfettamente l'altezza del primo tramite css. Funziona alla grande. Ma ecco la domanda: mi piacerebbe cambiare il contenuto di questo secondo div a seconda della sua altezza.

In altre parole, div 1 cambia in dimensione, div 2 segue attraverso css e ora devo attivare una chiamata ajax per ri-compilare div 2 con un nuovo contenuto, che si adatta alle sue nuove dimensioni.

Qualcuno ha un'idea di come posso farlo con jquery? Se possibile, senza l'uso di timeout?

Cheers.

Answer 1

come suggerisce the thread poelinca provided, ci sono alcuni plugin belle disponibili per questa funzionalità.

Se non ti piace l'idea del plugin, un'altra semplice soluzione sarebbe semplicemente attivare un evento "ridimensiona" sul div ogni volta che il contenuto viene modificato. Quindi è possibile monitorarlo con resize() come previsto, utilizzando un elegante 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

L'unica cosa che potrei pensare è avere un timer che controlla l'altezza ogni X secondi.

Qualcosa di simile a questo:

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

funziona come un fascino!

Ive testati attrchange ma questo non funzionava, ha perso due ore di lavoro :(