Nascondere parte di un div

[SimoX90]

Ciao a tutti!
Ho una pagina dinamica che utilizza ajax e j-query, ma il mio problema è di natura css.

Ho un div (lnres) che viene riempito da una chiamata ajax che stampa un div (cint) con una serie di div (k0,k1...) ecc. impilati uno sotto l'altro.

<div id='lnres'>
  <div id='#cint'>
   <div id='k0' class='ggl'>...</div>
   <div id='k1' class='ggl'>...</div>
    ...
  </div>
</div>

Quello che cerco di fare è di mostrarne uno per volta all'utente (impostando l'altezza del mio div contenitore (lnres) come l'altezza del div che devo mostrare (es. k0, e qui ci sono) e "tirando su" il div cint, in modo da visualizzare solo il contenuto che mi interessa. questa seconda parte non riesco a farla funzionare.


Questo il codice js

function animate(id){
id=id%$('.ggl').length;//controllo che id non cresca troppo
var somma=0;
for(j=0;j<$('.ggl').length;++j){
 if(j<id){
  somma=somma+$('#k'+j).height();//calcolo l'altezza dei div precedenti a quello da mostrare
 }
}
$('#lnres').height($('#lnres #k'+id).height());//ok
$('#cint').attr('margin-top',-somma+'px');//<------------------PROBLEMA
return false;
};

il problema è qui: $('#cint').attr('margin-top',-somma+'px'); il margine viene cambiato (nel senso che il valore viene aggiornato), ma il div non si muove di una virgola.

Ho anche provato a usare position:relative sul div esterno, absolute e top sul div interno ma non va neanche così...
___
P.S il codice che ho postato è semplificato (altrimenti il ciclo for così sarebbe superfluo xD)

[Nobody33]

Quali sono le attuali impostazioni css di #cint ?

[SimoX90]

#lnres{
border:1px solid red;
overflow:hidden;
height:100px;
position:relative;
}
#cint{
position:absolute;
top:0px;
margin-top:0px;

}

dove top e margin-top in realtà so che ne basta una (in base a come programmo la cosa) ma come dicevo prima non funziona in nessuno dei due modi

[Nobody33]

Puoi mostrare un link?

Pensavo avessi impostato qualche padding o margin che la fa scivolare, ma evidentemente non è cosi.
Non capisco quel "tirare su". Se non c'è niente in mezzo, dovrebbe stare in alto già di suo.

[SimoX90]

Purtroppo non posso postare un link perché è tutto in locale...
Con tirare su ciò che intendo è (facendo un esempio, supponiamo che l'utente clicchi sul pulsante per vedere k3, che richiama la funzione animate(3) ):

-voglio che l'utente visualizzi dentro a lnres il div k3
-il div k3 è contenuto nel div cres, che contiene uno dopo l'altro i div k0,k1,k2,k3 e magari anche k4,k5...
quindi imposto l'altezza di lnres come l'altezza di k3 (e qui è giusto)
-devo shiftare in alto il div cint dell'altezza dei div k0, k1 e k2 (che sono tutti quelli prima di k3).

Su quest'ultimo punto il problema, perché continuo a vedere il contenuto di k0. spero di essermi spiegato meglio.

[Nobody33]

spero di essermi spiegato meglio.

No .

Ma andando a sensazione credo sia pù che altro un problema di js.

Non potresti fare un if...else if...else...etc....che mostra di volta in volta il contenitore richiesto?
Poi non so, non c'ho capito un granché, anche per i nomi assurdi alle classi date....fa confusione se non c'è l'hai davanti.

[SimoX90]

http://jsfiddle.net/u5g3K/ (CLICCARE SUL BOX ROSSO

i div sono: result che è quello che contiene tutto
container che è dentro a result e contiene in sequenza k0,k1...
cliccando sul contenuto (sul coso rosso) l'altezza del div result (quello esterno) diventa quella di kN dove N è il numero successivo.
Ora basterebbe che container "scorresse" in su fino al N richiesto

Avevo pensato semplicemente di mettere un if ecc.. ma il problema è che tutti questi div rappresentano percorsi su una mappa, e la situazione dal vero è molto più complessa. Quindi la cosa ideale sarebbe far scorrere in su il div

[Nobody33]

Non è un problema css, ma del codice javascript.
I div non "scorrono" affatto al insù. E' il div (con il bordo rosso) che semplicemente diventa più piccolo.
Inoltre, a volte ci vuole un click, altre ce ne vogliono due.

Poi la situazione si complica, perché ora te ne sei uscito con una "mappa". Quale mappa? In che senso?

Intanto t'ho fatto un esempio del tutto diverso QUI . Vedi se ti è utile.

[SimoX90]

Il div con il bordo rosso cambia di dimensione perché gli dico io di farlo! Gli assegno l'altezza che deve avere di volta in volta.

Ciò che si deve spostare (non scorrere letteralmente) è il div con il bordo nero (container), che deve scivolare verso l'alto (sotto il margine sup del div con il bordo rosso)

Il tuo esempio lo uso già in molte parti di quella pagina, ma questa volta il problema è che devo mantenere quel div completo (senza nasconderne i vari pezzi) perché ho una funzione che poi lo rende nuovamente visibile (ma qua stiamo divagando).