View Full Version : How many is too man DIVs

01-27-2005, 02:22 PM
<this is perhaps better suited for the DOM board, but is not a specifically api usage question>

Basic Question : How many Absolutely positioned DIVs is considered reasonable to manage? Is there an point of sanity that should not be crossed?

Long Desciption :

I am attempting to write a boardgame map editor in Javascript. On each tile there are about 7 layers of things including backgrounds, walls, viewable items, game pieces, suprise rewards (treasure), etc that may be displayed. At the moment I'm generatine one container DIV per tile, and 7 layers within each the tile. Each thing I might draw would use the style.backgroundImage= of the appropriate layer. You get the picture. There is also one form, which reflects the state of whatever tile I click on. Pseudocode:

I am the only form, As Tiles are clicked I am updated via JS

Layer 1 Options: <select>
Layer 7 Options: <select>


for( var y=0; y<board.length; y++ ) {
for( var x=0; x<board.length; x++ ) {
pos = calculateAbsolutePosition()
id = 'tile_'+ y +'_'+ x
doc.write('<div id="'+ id +'" style="position: absolute;'+ pos +'">')

This works fine in general but ... with a gameboard size approaching 10X10 (~800 layers) the form selects react slowly to my clicks, each tile reacts fine and highlights itself quickly... with a gameboard size of 20x25 (~4000 layers) it is eating up 80% of my 1.4GHz processor for several seconds before displaying the select options, tile response time is fine. Only the form seems slow to respond.

This unwanted behavior happens both on Ie6 and on Firefox.

Is there any method of getting around this that isn't specific to my design, any principles or easier ways of handling this concept that I am not seeing?

01-27-2005, 03:08 PM
if you use a table for the board, you'll find it much easier. note this wouldn't be breaking accessibility rules since a table can be considered a grid which is also what a board (as in chess-type boards) is.