Bij het aanmaken van een simpel "drag and drop" systeempje loop ik tegen het probleem dat ik de hoogte van twee kolommen runtime moet passen. Omdat een voorbeeld altijd prettiger werkt dan alleen uitleg heb ik hier een voorbeeldje staan.
Ik heb daar dus twee kolommen. Informatiecontainers (div's) kunnen naar boven en beneden en van kolom naar kolom gesleept worden. De structuur hiervoor is eigenlijk vrij simpel:
Waarbij de divjes binnen de hoofddiv's versleept kunnen worden. Nu kom ik echter bij mijn probleem. Stel dat ik bijvoorbeeld een div van de rechter naar de linkerkolom sleep, dan wordt de rechterkolom hoger, en de linkerkolom kleiner (namelijk gewoon de hoogte van het aantal divjes. De bedoeling is dat op dat moment beide hoofddivs even lang worden. Een heel verhaal voor misschien een vrij eenvoudige vraag, maar op deze manier is het duidelijk wat de bedoeling is.
Ik heb al van alles geprobeert in het kader van javascript zoals bijvoorbeeld onderstaande stukje code... Maar het werkt niet en ik kom er niet uit. Het zou fijn zijn als iemand me op weg zou kunnen helpen.
Ik heb daar dus twee kolommen. Informatiecontainers (div's) kunnen naar boven en beneden en van kolom naar kolom gesleept worden. De structuur hiervoor is eigenlijk vrij simpel:
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| <div linkerkolom>
<div>
item1
</div>
<div>
item2
</div>
</div>
<div rechterkolom>
<div>
item3
</div>
<div>
item4
</div>
</div> |
Waarbij de divjes binnen de hoofddiv's versleept kunnen worden. Nu kom ik echter bij mijn probleem. Stel dat ik bijvoorbeeld een div van de rechter naar de linkerkolom sleep, dan wordt de rechterkolom hoger, en de linkerkolom kleiner (namelijk gewoon de hoogte van het aantal divjes. De bedoeling is dat op dat moment beide hoofddivs even lang worden. Een heel verhaal voor misschien een vrij eenvoudige vraag, maar op deze manier is het duidelijk wat de bedoeling is.
Ik heb al van alles geprobeert in het kader van javascript zoals bijvoorbeeld onderstaande stukje code... Maar het werkt niet en ik kom er niet uit. Het zou fijn zijn als iemand me op weg zou kunnen helpen.
code:
1
2
3
4
5
6
7
8
| <script type="text/javascript">
function wechange ( ) {
document.getElementById('test').style.Height = document.getElementById('floatContainerLeft').Height;
document.getElementById('floatContainerLeft').style.height ='100%';
document.getElementById('floatContainerRight').style.height ='100%';
}
</script> |
[ Voor 44% gewijzigd door Verwijderd op 20-11-2005 20:51 ]
