
previous

page 2
next
the main panel
A separate function, draw() will be used to position the cards on the screen according to what is in the g_main_cols arrays. CSS grid will make this very easy.
draw()
function draw() {
for (var c=1;c<9;c++) {
var ids=g_main_cols[c];
for (var i=0;i<ids.length;i++) {
var id=ids[i]; var r=i+1;
var el=document.getElementById(id);
el.style.gridRowStart=r;
el.style.gridColumnStart=c;
}
}
}
for (var c=1;c<9;c++) {
var ids=g_main_cols[c];
for (var i=0;i<ids.length;i++) {
var id=ids[i]; var r=i+1;
var el=document.getElementById(id);
el.style.gridRowStart=r;
el.style.gridColumnStart=c;
}
}
}
But, of course, we're going to need 48 card images (ids 0 to 51 but with no image for 0, 13, 26 or 39) already on the screen.
previous
next